Photo by Julian Hochgesang on Unsplash
Html 禁用referer
本地网站html图片或链接,跳过,隐藏,,删除,禁用referer
1 2 3 4 5 6 7 8 9 10 11 12 <meta name ="referrer" content ="never" > 值的解释 never always origin default 1.如果 referer-policy 的值为never:删除 http head 中的 referer; 2.如果 referer-policy 的值为default:如果当前页面使用的是 https 协议,而正要加载的资源使用的是普通的 http 协议,则将 http header 中的 referer 置为空; 3.如果 referer-policy 的值为 origin:只发送 origin 部分; 4.如果 referer-policy 的值为 always:不改变http header 中的 referer 的值,注意:这种情况下,如果当前页面使用了 https 协议,而要加载的资源使用的是 http 协议,加载资源的请求头中也会携带 referer。 ———————————————— 参考链接:https://blog.csdn.net/weixin_43627766/java/article/details/90311889
表单禁止自动填写 如何禁止注册表单的自动填写邮箱、密码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 语法 <input autocomplete="on|off"> 属性值 值 描述 on 默认。规定启用自动完成功能。 off 规定禁用自动完成功能。 实例 启用自动完成功能的 HTML 表单(其中一个输入字段禁用了自动完成): <form action="demo_form.html" autocomplete="on"> First name:<input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> E-mail: <input type="email" name="email" autocomplete="off"><br> <input type="submit"> </form> ———————————————— 参考链接:https://www.runoob.com/tags/att-input-autocomplete.html
Css 文字水平居中 1 <div style ="text-align: center;" > 文字水平居中</div >
文本垂直水平居中 1 2 <div style ="width:200px;height:100px;line-height: 100px;" > 文本垂直水平居中</div > <div style ="vertical-align: middle" > 文本垂直水平居中</div >
清除表格白边 1 2 3 table { border-collapse : collapse; }
鼠标样式修改 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 span { cursor : pointer; }
div居中的几种方法 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 .box { width :50% ; height : 50% ; position : absolute; background :red; margin : auto; top :0 ; bottom :0 ; left :0 ; right :0 ; } <!DOCTYPE html > <html > <head> <meta charset="utf-8 "> <title>登陆</title> <style type="text/css"> html {width : 100% ;height : 100% ;} body { width : 100% ; height : 100% ; display : flex; justify-content : center; align-items : center; } #login { width : 300px ; height : 300px ; border : 1px black solid; display : flex; flex-direction : column; justify-content : center; align-items : center; } </style> </head> <body > <div id="login"> <h1 >登陆</h1 > <input type="text"><br> <input type="password"><br> <button >确定</button > </div > </body > </html > ———————————————— 参考链接:https://www.cnblogs.com/jing-tian/p/10969887 .html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 input ::-webkit-input-placeholder { color : #BDCADA ; } input :-moz-placeholder { color : #BDCADA ; } input ::-moz-placeholder { color : #BDCADA ; } input :-ms-input-placeholder { color : #BDCADA ; } ———————————————— 参考链接:https://blog.csdn.net/zeyu1021/article/details/44563393
删除超链接A标签下划线 1 2 3 4 5 6 a :link ,a :visited { text-decoration :none; } a :hover { text-decoration :underline; }
css3圆角 1 2 border-radius :上 右 下 左;border-radius : 15px 50px 30px 5px :
css3盒子阴影 1 2 3 4 5 6 7 8 9 10 11 值 说明 h-shadow 必需的。水平阴影的位置。允许负值 v-shadow 必需的。垂直阴影的位置。允许负值 blur 可选。模糊距离 spread 可选。阴影的大小 color 可选。阴影的颜色。在CSS颜色值寻找颜色值的完整列表inset 可选。从外层的阴影(开始时)改变阴影内侧阴影 box-shadow : 10px 10px 5px #888888 ;———————————————— 参考链接:https://www.runoob.com/cssref/css3-pr-box-shadow.html
rgba 1 2 3 4 5 6 7 8 值 描述 red 定义红色值,取值范围为 0 ~ 255,也可以使用百分比 0% ~ 100%。 green 定义绿色值,取值范围为 0 ~ 255,也可以使用百分比 0% ~ 100%。 blue 定义蓝色值,取值范围为 0 ~ 255,也可以使用百分比 0% ~ 100%。 alpha - 透明度 定义透明度 0(透完全明) ~ 1(完全不透明) ———————————————— 参考链接:https://www.runoob.com/cssref/func-rgba.html
filter(滤镜) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 默认值: none 继承: no 动画支持: 是。详细可查阅 CSS 动画 https://www.runoob.com/cssref/css-animatable.html 版本: CSS3 JavaScript 语法: object.style.WebkitFilter="grayscale(100%)" 高斯模糊 img { -webkit-filter : blur (5px ); filter : blur (5px ); } ———————————————— 日期:2020 /10 /22 参考链接:https://www.runoob.com/cssref/css3-pr-filter.html
outline(轮廓) 1 2 3 4 5 6 7 8 9 10 11 12 13 属性值 值 描述 outline-color 规定边框的颜色。参阅:outline-color 中可能的值。 outline-style 规定边框的样式。参阅:outline-style 中可能的值。 outline-width 规定边框的宽度。参阅:outline-width 中可能的值。 inherit 规定应该从父元素继承 outline 属性的设置。 input{ outline:#00FF00 dotted thick; } ———————————————— 日期:2020/10/22 参考链接:https://www.runoob.com/cssref/pr-outline.html
悬浮按钮
transform: translateX(-50%); 重点,不然左右不能居中
1 2 3 4 5 6 7 8 9 10 11 12 13 14 .float-btn { position : fixed; bottom : 30px ; left : 50% ; right : 50% ; border : solid 1px #666 ; border-radius : 30px ; width : 50px ; height : 30px ; text-align : center; line-height : 30px ; padding : 0 10px ; transform : translateX (-50% ); }
Js 常用 1 2 3 4 'nobige.cn' .split ('.' )['nobige' ,'cn' ].join ('.' )
类型转换
类型转换,Number() 转换为数字, String() 转换为字符串, Boolean() 转化为布尔值。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 typeof "John" typeof 3.14 typeof NaN typeof false typeof [1 ,2 ,3 ,4 ] typeof {name :'John' , age :34 } typeof new Date () typeof function ( ) {} typeof myCar typeof null "John" .constructor (3.14 ).constructor false .constructor [1 ,2 ,3 ,4 ].constructor {name :'John' , age :34 }.constructor new Date ().constructor function ( ) {}.constructor String (x) String (123 ) String (100 + 23 ) String (false ) String (true ) Date () String (new Date ()) x.toString () (123 ).toString () (100 + 23 ).toString () false .toString () true .toString () (new Date ()).toString () toExponential () 把对象的值转换为指数计数法。toFixed () 把数字转换为字符串,结果的小数点后有指定位数的数字。toPrecision () 把数字格式化为指定的长度。getDate () 从 Date 对象返回一个月中的某一天 (1 ~ 31 )。getDay () 从 Date 对象返回一周中的某一天 (0 ~ 6 )。getFullYear () 从 Date 对象以四位数字返回年份。getHours () 返回 Date 对象的小时 (0 ~ 23 )。getMilliseconds () 返回 Date 对象的毫秒(0 ~ 999 )。getMinutes () 返回 Date 对象的分钟 (0 ~ 59 )。getMonth () 从 Date 对象返回月份 (0 ~ 11 )。getSeconds () 返回 Date 对象的秒数 (0 ~ 59 )。getTime () 返回 1970 年 1 月 1 日至今的毫秒数。Number ("3.14" ) Number (" " ) Number ("" ) Number ("99 88" ) parseFloat () 解析一个字符串,并返回一个浮点数。parseInt () 解析一个字符串,并返回一个整数。Number (false ) Number (true ) d = new Date (); Number (d) d = new Date (); d.getTime () ———————————————— 参考链接:https :
JavaScript 刷新当前页面 1 2 3 4 5 6 7 8 location.reload (); window .location .replace ("https://nobige.cn" )<meta http-equiv="refresh" content="5" > ———————————————— 参考链接:https :
JavaScript获取时间戳与时间戳转化 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 Javascript 获取当前时间戳(毫秒级别):第一种方法: var timestamp1 = Date .parse ( new Date ());结果:1470220594000 第二种方法: var timestamp2 = ( new Date ()).valueOf ();结果:1470220608533 第三种方法: var timestamp3 = new Date ().getTime ();结果:1470220608533 第一种获取的时间戳是精确到秒,第二种和第三种是获取的时间戳精确到毫秒。 获取指定时间的时间戳: new Date ("2016-08-03 00:00:00" );时间戳转化成时间: function timetrans (date ){ var date = new Date (date*1000 ); var Y = date.getFullYear () + '-' ; var M = (date.getMonth ()+1 < 10 ? '0' +(date.getMonth ()+1 ) : date.getMonth ()+1 ) + '-' ; var D = (date.getDate () < 10 ? '0' + (date.getDate ()) : date.getDate ()) + ' ' ; var h = (date.getHours () < 10 ? '0' + date.getHours () : date.getHours ()) + ':' ; var m = (date.getMinutes () <10 ? '0' + date.getMinutes () : date.getMinutes ()) + ':' ; var s = (date.getSeconds () <10 ? '0' + date.getSeconds () : date.getSeconds ()); return Y+M+D+h+m+s; } ———————————————— 参考链接:https :
JS设置CSS样式的几种方式 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 如果属性有'-' 号,就写成驼峰的形式(如textAlign) 如果想保留 - 号,就中括号的形式 element.style ['text-align' ] = '100px' ; element.style .height = '100px' ; element.setAttribute ('height' , 100 ); element.setAttribute ('height' , '100px' ); element.setAttribute ('style' , 'height: 100px !important' ); element.style .setProperty ('height' , '300px' , 'important' ); element.className = 'blue' ; element.className += 'blue fb' ; element.style .cssText = 'height: 100px !important' ; ———————————————— 参考链接:https :
骚操作 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 0 ==false 1 ==true 'nobige' || 0 if (isOnline) { postMessage (); } isOnline && postMessage (); var temp = a; a = b; b = temp; a ^= b; b ^= a; a ^= b; void 0 == undefined !0 ==true !1 ==false ~'nobige.cn' .indexOf ('com' ) parseInt (num)~~num num >> 0 num << 0 num | 0 Math .random ().toString (16 ).substr (2 )'#' +Math .random ().toString (16 ).substr (2 , 6 )console .info ("%cNobige" , "color: #181818; font-size: 30px; font-family: sans-serif" );var a = x > 0 ? !0 : !1 n = +'18' n = 18 +'' var array = [0 , 1 , 2 , 3 , 4 , 5 ];array.length = 3 ; console .log (array); var a = 1 , b = a, c = b;!(function ( ){ })(); document .documentElement .scrollTop
奇偶数判断 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 2 % 2 = 0 3 % 2 = 1 num % 2 === 0 ? '偶数' : '奇数' 2 & 1 = 0 3 & 1 = 1 num & 1 === 0 ? '偶数' : '奇数' ———————————————— 日期:2020 /10 /22 参考链接:https :
判断是否为空Null 1 2 3 4 5 6 7 var a='' if ([null , undefined , '' ].includes (a)){ console .log ('is null' ) } if (~[null , undefined , '' ].indexOf (a)){ console .log ('is null' ) }
时间戳转日期 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 function time (time = +new Date () ) { var date = new Date (time + 8 * 3600 * 1000 ); return date.toJSON ().substr (0 , 19 ).replace ('T' , ' ' ); } function time (time = +new Date () ) { var date = new Date (time + 8 * 3600 * 1000 ); return date.toJSON ().substr (0 , 19 ).replace ('T' , ' ' ).replace (/-/g , '.' ); } ———————————————— 日期:2020 /10 /26 参考链接:https : ———————————————— 日期:2020 -10 -26 参考链接:https :
javascript书签 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 javascript :( )(); javascript :(function ( ) {var txt = "————————————————\n日期:" +new Date ().toISOString ().substr (0 ,10 )+"\n参考链接:" +window .location .href ;prompt ('参考' ,txt)})(); javascript :(function ( ) {var a=0 ,aN=0 ;jQuery.each (jQuery ("#position_shares > div.poptableWrap > table" ).find ('tr' ), function (index, val ) { var x = jQuery (this ).find ('td:nth-child(2)' ).text (), y = jQuery (this ).find ('td:nth-child(3)' ).text (), xAll = jQuery ("#position_shares > div.poptableWrap > p > span.sum-num" ).text (); y = y.replace ('%' ,'' ); xAll = xAll.replace ('%' ,'' )/100 ; aN = y>0 ?aN+1 :aN; a+=x.replace ('%' ,'' )/10 *y*xAll; }); alert ('预计涨幅:' +a+'\n涨的个数:' +aN);})();
html拼接 1 2 3 4 5 6 7 8 9 `` var txt = ` ———————————————— 日期:${new Date ().toISOString().substr(0 ,10 )} 参考链接:${window .location.href} `
关键词 1 2 3 4 5 String ('nobige.cn' ).split ('.' )continue
禁止Debug
让JS控制台永远Debuger状态,禁止F12控制台调试JavaScript
加密前手动添加各个位置效果会更好,最好配合无限循环
1 2 3 4 5 6 7 8 9 (function (a ) { return (function (a ) { return (Function ('Function(arguments[0]+"' + a + '")()' )) })(a) })('bugger' )('de' , 0 , 0 , (0 , 0 ));
获取URL参数 1 2 3 4 5 6 7 8 9 10 11 12 13 14 var getUrlParam = function (name ){ var url = window .location .search ; var reg = new RegExp ("(^|&)" + name +"=([^&]*)(&|$)" ); var result = url.substr (1 ).match (reg); return result ? decodeURIComponent (result[2 ]) : null ; }
数组转URL参数 1 2 3 4 5 6 7 8 9 10 var arr2url = function (x ) { var y = []; Object .entries (x).forEach (([a, b] ) => { y.push (a + '=' + b); }); return '?' + y.join ('&' ); }
Arguments 对象
arguments 是一个对应于传递给函数的参数的类数组对象。
IE 3+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/arguments
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 function func1 (a,b ) { console .log (arguments [0 ]); console .log (arguments [1 ]); console .log (arguments [2 ]); } func1 (1 , 2 , 3 );> 1 > 2 > 3
Object.keys()
Object.keys()
方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致。
IE 9+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/keys
1 2 3 4 5 6 7 var arr = ['a' , 'b' , 'c' ];console .log (Object .keys (arr)); var obj = { 0 : 'a' , 1 : 'b' , 2 : 'c' };console .log (Object .keys (obj));
Object.prototype.hasOwnProperty()
hasOwnProperty()
方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性(也就是,是否有指定的键)
IE 5.5+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty
1 2 3 4 5 6 7 8 9 10 11 12 const object1 = {};object1.property1 = 42 ; console .log (object1.hasOwnProperty ('property1' ));console .log (object1.hasOwnProperty ('toString' ));console .log (object1.hasOwnProperty ('hasOwnProperty' ));
Array.prototype.map()
map()
方法创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成
IE 9+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map
1 2 3 4 5 6 7 8 9 10 11 const array1 = [1 , 4 , 9 , 16 ];const map1 = array1.map (x => x * 2 );console .log (map1);return
Array.prototype.filter()
filter()
方法创建一个新数组,其包含通过所提供函数实现的测试的所有元素。
IE 9+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
1 2 3 4 5 6 7 8 9 10 const words = ['spray' , 'limit' , 'elite' , 'exuberant' , 'destruction' , 'present' ];const result = words.filter (word => word.length > 6 );console .log (result);return
for…in
for...in
语句以任意顺序迭代一个对象的除Symbol以外的可枚举属性,包括继承的可枚举属性。
IE 3+
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...in#%E6%B5%8F%E8%A7%88%E5%99%A8%E5%85%BC%E5%AE%B9
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 var obj = {a :1 , b :2 , c :3 };for (var prop in obj) { console .log ("obj." + prop + " = " + obj[prop]); } var obj = {a : 1 , b : 2 , c : 3 };for (var i = 0 in obj) { console .log (obj[i]); }
方法 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 abs acos anchor apply asin atan atan2 atEnd big blink bold call ceil charAt charCodeAt compile concat concat cos decodeURI decodeURIComponent dimensions escape eval exec exp fixed floor fontcolor fontsize fromCharCode getDate getDay getFullYear getHours getItem getMilliseconds getMinutes getMonth getSeconds getTime getTimezoneOffset getUTCDate getUTCDay getUTCFullYear getUTCHours getUTCMilliseconds getUTCMinutes getUTCMonth getUTCSeconds getVarDate getYear hasOwnProperty indexOf isFinite isNaN isPrototypeOf italics item join lastIndexOf lbound link localeCompare log match max min moveFirst moveNext parse parseFloat parseInt pop pow push random replace reverse round search setDate setFullYear setHours setMilliseconds setMinutes setMonth setSeconds setTime setUTCDate setUTCFullYear setUTCHours setUTCMilliseconds setUTCMinutes setUTCMonth setUTCSeconds setYear shift sin slice slice small sort splice split sqrt strike sub substr substring sup tan test toArray toDateString toExponential toFixed toGMTString toLocaleDateString toLocaleLowercase toLocaleTimeString toLocaleString toLocaleUppercase toLowerCase toPrecision toString toTimeString toUpperCase toUTCString ubound unescape unshift UTC valueOf
Document 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 document .activeElement document .addEventListener () document .adoptNode (node) document .anchors document .baseURI document .body document .close () document .cookie document .createAttribute () document .createComment () document .createDocumentFragment () document .createElement () document .createTextNode () document .doctype document .documentElement document .documentMode document .documentURI document .domain document .embeds document .forms document .getElementsByClassName () document .getElementById () document .getElementsByName () document .getElementsByTagName () document .images document .implementation document .importNode () document .inputEncoding document .lastModified document .links document .normalize () document .normalizeDocument () document .open () document .querySelector () document .querySelectorAll () document .readyState document .referrer document .removeEventListener () document .renameNode () document .scripts document .strictErrorChecking document .title document .URL document .write () document .writeln ()
Jquery 代替js字符拼接 1 2 3 4 5 6 7 $('<div/>' ,{ text : 'Div text' , class : 'className' }).appendTo ('#parentDiv' ); ———————————————— 日期:2020 /10 /22 参考链接:https :
表单重置 1 2 3 4 5 6 7 <button type="reset" style="display:none;" ></button> $("button[type='reset']" ).trigger ("click" ); ———————————————— 日期:2021 -11 -01 参考链接:https :
Layui layui清空,重置表单数据的数据