Article Detail

常用html、demo代码

暗网网址导航hidden wikihttp://zqktlwi4fecvo6ri.onion HTML特殊字符编码对照表 console.log(allnum)...

HTML 阅读 2804.6万 14 分钟阅读 2015-10-15 14:45

暗网网址导航hidden wiki

http://zqktlwi4fecvo6ri.onion

HTML特殊字符编码对照表

console.log(allnum);
javascript:;
vertical-align:middle;
strconv=yes+js
echo str_ireplace("WORLD","Shanghai","Hello world!");//不区分大小写
<a href="javascript:scroll(0,0)">返回顶部</a>
jquery多个节点绑定同一个事件
$('#begin,#end') 用逗号隔开

target="_blank"
index.php?g=Admin&m=Login
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="renderer" content="webkit">
 location.href = url;

autocomplete="off"
<form name="input" action="html_form_action.asp" method="get">
Username: 
<input type="text" name="user" />
<input type="submit" value="提交" />
<input type="button" value="提交">
</form>

$.ajax({
	type: "POST",
	url:'/index.php?g=User&m=Post&a=Message&ajax=ajax',
	data:$('#myform').serialize(),
	error: function(request) {
		alert("提交失败");
	},
	success: function(data) {
		if(data>0){
			alert('留言提交成功！');
			location.reload();
		}else alert("提交失败");
		
	}
});

function ajaxpost(tel,pass){
    $.ajax( {
        url:"/index.php/Home/Register/is_login.html", 
        type: "post", 
        data:"tel="+tel+"&pass="+pass,
        //dataType: "json",
        //cache: false,
        //async: false,
        beforeSend: function(){
         // Handle the beforeSend event
        },
        success: function(data){
            
        }
    });
}

 <a href="javascript:scroll(0,0)">顶部</a> <a href="#copy">底部</a>

<meta charset="UTF-8" />

<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<!DOCTYPE html>
<html>
<head>
<title>Title</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="icon" href="/favicon.ico">
<meta name="keywords" content="常用代码">
<meta name="description" content="isWTF's blog!!">
</head>

<body>

</body>

</html>

$.ajax( {
	url: '/index.php?s=/addon/WeiSite/WeiSite/ForgetPassword/tel/'+shoujihao+'/codeddd/'+codeddd+'.html', //这里是静态页的地址
	type: "GET", //静态页用get方法，否则服务器会抛出405错误
	//dataType: "json",
	//cache: false,
	//async: false,
	beforeSend: function(){
	 // Handle the beforeSend event
	},
	success: function(data){
		//var result = $(data).find("另一个html页面的指定的一部分").html();
	}
});

<link rel="apple-touch-icon" size="72x72" href="/icon-ipad.png" />
<link rel="apple-touch-icon" size="114x114" href="/icon-iphone4.png" />
<link rel="icon" href="/favicon.ico">
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<meta name="keywords" content="常用代码">
<meta name="description" content="isWTF's blog!!">

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection" content="telephone=no" />

I('post.id',0,'intval'); // 用intval过滤$_POST['id']
I('get.title','','strip_tags'); // 用strip_tags过滤$_GET['title']

移动端UC /QQ 浏览器的部分私有Meta 属性
下面就说下移动端UC /QQ 浏览器的部分私有Meta 属性，都来自其开发者文档（UC开发者中心，左下一doc文档，QQ浏览器）。

UC 浏览器的部分私有Meta 属性
设置屏幕方向为横屏还是竖屏
<meta name="screen-orientation" content="portrait|landscape">
设置是否全屏，yes表示强制浏览器全屏
<meta name="full-screen" content="yes">
缩放不出滚动条
<meta name="viewport" content="uc-fitscreen=no|yes"/>
设置no后用户缩放与标准浏览器缩放一直，设置为yes后，用户缩放金放到图片和文字，不出现横向滚动条。
排版
<meta name="layoutmode" content="fitscreen|standard" />
  fitscreen模式简化页面处理，适合页面阅读节省流量，standard模式和标准浏览器一致；一旦设置layoutmode meta后，用户使用浏览器提供的的排版模式选项将会无效。
夜间模式
<meta name="nightmode" content="enable|disable"/>
nightmode的值设置为disable后，即使用户使用浏览器的夜间模式，页面的表现也仍然是非夜间模式。
强制图片显示
<meta name="imagemode" content="force"/>
 UC浏览器为了节省流量，为用户提供了无图模式，但是如果页面的图片是必不可少的，如验证码的，需要强制浏览器显示图片，可以设置imagemode， 不影响子页面。通过META设置图片加载方式会作用于整个页面，如果希望对单个图片进行设置，那么可以使用这个
<img src="..." show="force">
应用模式
<meta name="browsermode" content="application"/>
使用了application这种应用模式后，页面讲默认全屏，禁止长按菜单，禁止收拾，标准排版，以及强制图片显示。

QQ 浏览器x5内核定制标签说明
设置屏幕方向
<meta name="x5-orientation" content="portrait|landscape" />
设置全屏
<meta name="x5-fullscreen" content="true" />
设置屏幕模式
<meta name="x5-page-mode" content="app" />

对于控制全屏的meta 标签，UC 跟QQ 处理的方式稍有不同：区别在于处理系统状态栏，UC 是直接覆盖系统状态栏，而QQ 仍然保留之。

$("p").css("color","red");
//同时设置字体大小和背景色   
$("p").css({"fontSize":"30px" ,"backgroundColor":"#ccc"});
$("button").click(function(){
  $("div").animate({
    left:'250px',
    height:'+=150px',
    width:'+=150px'
  });
});

header('Content-Type:text/html;charset=utf-8'); //避免输出乱码 

<img  title="点击刷新" src="cache/yzm.php" align="absbottom" onclick="this.src='cache/yzm.php?'+Math.random();" />

<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.0/jquery.min.js"></script>

<link rel="stylesheet" href="http://lizhenqiu.com/templates/default/style.css" type="text/css" media="screen">

<script type="text/javascript">jQuery(".slideTxtBox").slide(); </script>

Yourphp手册
简单文本编辑器

data:text/html, <title>Text Editor</title><body contenteditable style="font-size:2rem;font-family:georgia;line-height:1.4;max-width:60rem;margin:0 auto;padding:4rem;"> lizhenqiu.com

Chrome提供了一个简单的方法。首先，按“F12”打开控制台，然后输入：

document.designMode = "on"

添加到收藏夹URL填写下面的即可在当前页面点击收藏夹编辑页面

javascript:(function(){document.designMode = "on" })();

接下来，你就可以编辑屏幕上的文本内容了。

编辑器

data:text/html, <html contenteditable>

如果你想找回不小心关闭的Tab页面，只需要同时按下“Control"（Mac用户请按“Command”）、“Shift"和“T”。

js随机数

function getRandom(n){
        return Math.floor(Math.random()*n+1)
        }

top.location.href 和 localtion.href 有什么不同

top.location.href=”url”

在顶层页面打开url（跳出框架）

self.location.href=”url”

仅在本页面打开url地址

parent.location.href=”url”

在父窗口打开Url地址

this.location.href=”url”

用法和self的用法一致
if (top.location == self.location) 判断当前location 是否为顶层来禁止frame引用　如果页面当中有自定义的frame的话，也可以将parent self top换为自定义frame的名称效果就是在自定义frame窗口打开url地址

实际中可能这样使用

if(top !== self){             top.location.href = location.href;         }

禁止frame引用
以下是从网上找到的一个例子，不是很直观，我加了上面那三行代码，可以先去掉，再加上，看一下效果，就很清楚了以下是top.htm 代码

<script language=javascript> function rs(){

        if(top !== self){             top.location.href = location.href;         }   parent.left.location.href="top.htm" parent.bot.location.href="top.htm" } < /script> < input type=button name=name value="ksdj" onclick=rs();>

以下是一个随意文件名的htm文件:

<FRAMESET COLS="150,*"> < FRAME SRC="left.htm" name=left> < FRAMESET ROWS="150,*"> < FRAME SRC="top.htm" name=top> < FRAME SRC="bot.htm" name=bot> < /FRAMESET> < /FRAMESET>

你自己试试,我想你要的可能就是这样的效果!

top表示主窗口，location表示当前窗口，如果你的文件只有一个框架，没有iframe和frmaeset，那么是完全一致的，没有区别。

top.location是在顶层frame中打开新页
window.location是在当前frame中打开新页
parent.location 在当前窗口的父窗口打开Url地址

<select id="isAudit" name="isAudit"> 
<option value="2">全部</option> 
<option value="1" selected = "selected">通过</option> 
<option value="0">未通过</option> 
</select>

修改ID增加ID属性，修改class同理
$('.div').attr('id','newid');

如果是给标签添加class样式可以这样
$('#div').addClass('css类名');

strtotime("-1 week")， strtotime("-n days");可以很方便的获取当前日期的前n天、周、月的时间戳

舒适网页配色方案
 px像素转换rem单位工具

Comments 评论区

广西河池市宜州市 2018-03-01 17:55

Div里超出部分，省略号显示

1.一行显示并出现省略号

1）三个属性：

 overflow: hidden;
 text-overflow: ellipsis;
 white-space: nowrap;
 overflow: hidden和white-space: nowrap都是必须的否则不会显示省略号；

2）网上张大神想出来的margin-top负值的办法：

<div class="box">
　　　　<div class="wz">文字内容</div>
　　　　<div class="dot">...</div>
</div>

CSS:

.box{
　　　　width:设定宽度；
　　　　height:设定高度；
　　　　overflow:hidden;
　　}
.wz{
　　　　float:left;
　　　　height:设定同样的高度；
　　　　margin-right:这里的大小是给省略号留的空间；
　　}
.dot{
　　　　float:right;
　　　　width:刚才留的空间大小；
　　　　height：设定同样的高度；
　　　　margin-top:与高度一样的值的负数；
　　}

这种方法应该是兼容所有的浏览器。

还有用js或者插件来解决的方法，感觉有点麻烦。

2.两行显示，第二行出现省略号

当文字强制两行显示，并且在第二行才出现省略号。解决办法：

text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;

这个是使用的是-webkit-的私有属性，只有在谷歌浏览器上才能正确显示出来，其它浏览器无效果,多用于手机端。-webkit-line-clamp: 3;就是表示第几行才显示省略号。

#⁰

广西河池市宜州市 2018-03-02 09:25

更多评论图标

#⁰

广西河池市宜州市 2018-03-02 16:02

display: flex; 的兼容问题解决办法

.cardBagMxList {
height: 1.2rem;
display: -webkit-flex; 
display: flex;	
/* for uc */
display: -webkit-box; 
display: -ms-flexbox; /* TWEENER - IE 10 */
}
.cardBagMxList div {
text-align: center;
color: #888888;
font-size: 0.24rem;
padding-top: 0.25rem;
-ms-flex: 1; /* IE 10 */
-webkit-flex: 1; 
flex: 1; 
/* for uc */
-webkit-box-flex: 1; 
-moz-box-flex: 1; 
-ms-flex: 1;
}

#⁰

广西河池市宜州市 2018-03-02 16:54

仿造张鑫旭-鑫空间-鑫生活博客回到相关文章按钮动画效果

<style>
#back{line-height:40px;position:absolute;right:20px;padding: 0 10px 0 13px;background-color: #000;animation:tada 1s 1s;color: #cd0000;font-size:12px;}
@keyframes tada {
  from {
    transform: scale3d(1, 1, 1);
  }
  10%, 20% {
    transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
  }
  30%, 50%, 70%, 90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }
  40%, 60%, 80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
</style>
<a href="http://www.zhangxinxu.com/" id="back" style="">回到相关文章 »</a>
<script>
var BAK = document.getElementById('back');
if (BAK){setInterval(function () {BAK.style.animation='none';BAK.offsetHeight;BAK.style.animation='';}, 3000);}
</script>

#⁰

广西河池市宜州市 2018-03-02 17:20

js bind 传递参数
Jquery之Bind方法参数传递与接收的三种方法
方法一、

function GetCode(event)
{
alert(event.data.foo);
}
$(document).ready(function()
{
$("#summary").bind("click", {foo:'abc'} ,GetCode);
});

方法二、
函数句柄

$("#summary").bind("click", function()
{
GetCode("abc")
});
function GetCode(str)
{
}

方法三、
函数闭包

function GetCode(str)
{
return function()
{
alert(str)
}}
$("#summary").bind("click", GetCode("abc"));

广西河池市宜州市2018-03-02 17:22:06

<script type="text/javascript">
$(document).ready(function(){
  $("button").bind({
    click:function(){$("p").slideToggle();},
    mouseover:function(){$("body").css("background-color","red");},  
    mouseout:function(){$("body").css("background-color","#FFFFFF");}  
  });
});
</script>

广西河池市宜州市2018-03-02 17:22:35

$(selector).bind(event,data,function)

$(selector).bind({event:function, event:function, ...})

#⁰

广西河池市宜州市 2018-03-02 17:36

使用JS判断用户操作系统是否安装某字体

<script>var isSupportFontFamily=function(f){if(typeof f!="string"){return false}var h="Arial";if(f.toLowerCase()==h.toLowerCase()){return true}var e="a";var d=100;var a=100,i=100;var c=document.createElement("canvas");var b=c.getContext("2d");c.width=a;c.height=i;b.textAlign="center";b.fillStyle="black";b.textBaseline="middle";var g=function(j){b.clearRect(0,0,a,i);b.font=d+"px "+j+", "+h;b.fillText(e,a/2,i/2);var k=b.getImageData(0,0,a,i).data;return[].slice.call(k).filter(function(l){return l!=0})};return g(h).join("")!==g(f).join("")};

// isSupportMicrosoftYahei为true或者false
var isSupportMicrosoftYahei = isSupportFontFamily('Microsoft Yahei');
alert(isSupportMicrosoftYahei);
</script>

其中fontFamily参数是必须的，为CSS中font-family设置的web可识别的字体名称，例如宋体'simsun'，微软雅黑'Microsoft Yahei'等
如果用户的操作系统安装了微软雅黑，则isSupportMicrosoftYahei为true，否则为false。

由于本检测方法本质上是基于web检测，因此，fontFamily参数必须是web可识别的，因此，很多中文字体需要使用其英文名称如“思源黑体”， “兰亭黑体”等

原文：小tips: 使用JS检测用户是否安装某font-family字体

#⁰

广西河池市宜州市 2018-03-03 10:04

7 阶层叠水平(stacking level)

广西河池市宜州市2018-03-03 10:06:16

3D 动画硬件加速

.item {
  transform: translateZ(0);      /* 或者 will-change: transform; */
}

用CSS开启硬件加速来提高网站性能

#⁰

广西河池市宜州市 2018-03-03 11:51

CSS3实现图片循环旋转

@-webkit-keyframes rotation{
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(360deg);}
}

.Rotation{
-webkit-transform: rotate(360deg);
animation: rotation 3s linear infinite;
-moz-animation: rotation 3s linear infinite;
-webkit-animation: rotation 3s linear infinite;
-o-animation: rotation 3s linear infinite;
}

#⁰

广西河池市金城江区 2018-03-17 10:32

JS操作CSS随机改变网页背景
js 修改body js csstext js随机背景

<script>
var imgArr=['/images/b1.jpg', '/images/b2.jpg', '/images/b0.jpg'];
var indexImage=parseInt(Math.random()*(imgArr.length-0));
var currentImage=imgArr[indexImage];
document.getElementsByTagName('body')[0].style.cssText = "background: url("+currentImage+");background-repeat: no-repeat;background-position: left top;";
</script>

#⁰

广西河池市 2018-03-30 16:33

键盘图标，鼠标左键空格图标，鼠标图标，网页键盘图标

广西河池市2018-03-30 16:46:56

Flappy48 FLAPPY2048 网页免费版像素鸟 2048 跳跃上下
http://flash.7k7k.com/cms/cms10/20140425/1533365682/2a/unity3d.html

广西河池市2018-03-30 16:47:48

网页小游戏小鸟在线flash游戏

#⁰

广西河池市金城江区 2018-04-08 10:57

js返回时间戳秒数

<script>var aa = + new Date();
console.log(aa);
//返回值为：1520218413266
</script>

#⁰

广西河池市宜州市 2018-06-21 18:00

按钮3d立体阴影css

box-shadow: inset 0 0 5px #000000;

#⁰

广西河池市宜州市 2018-06-22 11:35

jQuery js 鼠标滚动页面滚动背景模糊放大效果css3动画

$(window).scroll(function(e) {

  var scrollSeviye = $(this).scrollTop();
  
  if(scrollSeviye>2400){
    scrollSeviye=2400;
  }
  
  var buyutme=(scrollSeviye/6000)+1;
 
  $('.arkaplan').css('-webkit-filter', 'blur('+scrollSeviye/120+'px)');
  $('.arkaplan').css('transform', 'scale('+buyutme+')');

});

#⁰

广西河池市 2018-06-27 11:44

简单的单击图片循环播放

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <img src="imges/01.jpg" alt="" id='img'>
    <button id='prev'>上一张</button>
    <button id='next'>下一张</button>
    
</body>
    <script>
        window.onload = function(){
            //获取要用到的元素，标签

            var img = document.getElementById('img');
            var prev = document.getElementById('prev');
            var next = document.getElementById('next');
            //定义两端的临界值， 定义活动的变量 最大5张、

            var maxIndex = 5;
            var minIndex = 1;
            var activeIndex = minIndex;
            
            // 确定事件源  绑定事件函数。

            prev.onclick = function(){
                //当点击 上一张的时候， img的src 实现切换
                img.src = 'imges/0' + activeIndex + '.jpg';
                
                if(activeIndex === 1){
                    activeIndex = 5;
                }else{activeIndex --;}
            }

            next.onclick = function(){
               
                if(activeIndex === 5){
                    activeIndex = 1;
                }else{
                    activeIndex++;
                }
                img.src = 'imges/0' + activeIndex + '.jpg';

            }

            

        }
    
    
    </script>
</html>

#⁰

江苏省南京市 2021-02-21 17:43

哈哈

广西桂林市2021-02-25 02:51:26

🤔🤯😴😬🔥

#⁰

广西南宁市 2021-08-02 18:33

<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<p onclick="ky();">跨域</p>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
function ky(){
	$.ajax({
	type: "POST",
	url:'http://group.jxttest.com/v1/articles/catsLists',
	error: function(request) {
		console.log('失败：'+request);
	},
	success: function(data) {
		console.log('成功：'+data);
		
	}
});
}
</script>

#⁰

广西桂林市七星区 2021-08-05 19:57

15tvah0u4izss

广西桂林市七星区2021-08-05 20:10:42

绝地求生登录钥匙：9b7805dbc6b34ba1a03c031889a5a540

#⁰

广西南宁市 2021-10-09 09:55

#⁰

广东省深圳市宝安区 2022-06-10 11:49

这博客有点东西😂

广西南宁市2022-06-13 10:45:26

🤯🤔😊

#⁰

第 14 / 14 页 当前展示 261 - 279 条，共 279 条评论

Comment Form 留下评论

正在回复 #0

粘贴图片、拖拽文件，或点上面的按钮上传 图片会自动插入 [img] 标签，其他附件会自动插入 [attach] 标签。

正在上传...

提交前会先拉起旧项目同款第三方人机验证。

不再要求填写昵称；reply 会生成一条带楼层回链的新评论，quote 会附带完整引用块，并保持评论锚点跳转。