web安全技能和小技巧
前端开发早已被好玩儿坏掉!像console.log()能够向控制面板輸出照片等酷炫的东西早已并不是哪些新闻报道了,像用||操作符给自变量赋默认值都是人尽皆知的旧闻了,今日见到Quora上1个贴子,一瞬间又GET了许多前端开发专业技能,某些归属于方法,一些则是闻所未闻的冷门知识,1时间还消化吸收不回来。现收集整理出去共享给大伙儿,也填补了某些平常的积淀和拓展了某些內容。
HTML篇
电脑浏览器地址栏运作JavaScript编码
这一许多人应当還是了解的,在电脑浏览器地址栏能够立即运作JavaScript编码,作法要以javascript:打头后跟要实行的句子。例如:
javascript:alert('hello from address bar :)');
将左右编码贴住电脑浏览器地址栏回车键后alert一切正常实行,1个弹出窗口神现。
必须特别注意的是要是是根据copy paste编码到电脑浏览器地址栏得话,IE及Chrome会全自动除掉编码打头的javascript:,因此必须手动式加上起來能够恰当实行,而Firefox中尽管不容易全自动除掉,但它本质就不兼容在地址栏运作JS编码,sigh~
这一技术性在我的另一篇文章睿文《让Chrome 移交电子邮件联接,接收电子邮件更便捷了》中有应用到,运用在电脑浏览器地址栏中实行JavaScript编码将Gmail设定为系统软件的电子邮件移交程序流程。
电脑浏览器地址栏运作HTML编码
也许上边哪条秘密了解的人算是多得话,那条秘籍了解的人还要少某些了,在非IE内核的电脑浏览器地址栏能够立即运作HTML编码!
例如在地址栏键入下列编码随后回车键运作,会出現特定的网页页面內容。
data:text/html,<h1>Hello, world!" data-word='h1' class="" >h1>101915156379194
你造么,能够把电脑浏览器当编辑器
還是电脑浏览器地址栏上写文章,将下列编码贴住地址栏运作后电脑浏览器变为了1个初始而简易的编辑器,与Windows内置的notepad相同,吼吼。
data:text/html, <html contenteditable>
说到底幸亏了HTML5中新加的contenteditable特性,当原素特定了该特性后,原素的內容变成可编写情况。
推而广之,将下列编码放进console实行后,全部网页页面将越来越可编写,随便鞭挞吧~
document.body.contentEditable='true';
运用a标识全自动分析URL
许多那时候人们有从1个URL中获取网站域名,查寻关键词,自变量参数值等的必须,而万万想不到能够让电脑浏览器便捷地帮人们进行这一每日任务而无需人们写正则表达式去爬取。方式就在JS编码里先建立1个a标识随后将必须分析的URL赋值给a的href特性,随后就获得了任何人们愿意的了。
var a = document.createElement('a'); a.href = 'http://www.cnblogs.com/wayou/p/'; console.log(a.host);
运用这一基本原理,略微拓展一下下,就获得了1个更为健硕的分析URL各一部分的通用性方式了。下边编码来源于James的搏客。
function parseURL(url) { var a = document.createElement('a'); a.href = url; return { source: url, protocol: a.protocol.replace(':',''), host: a.hostname, port: a.port, query: a.search, params: (function(){ var ret = {}, seg = a.search.replace(/^\?/,'').split('&'), len = seg.length, i = 0, s; for (;iif (!seg[i]) { continue; } s = seg[i].split('='); ret[s[0]] = s[1]; } return ret; })(), file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1], hash: a.hash.replace('#',''), path: a.pathname.replace(/^([^\/])/,'/$1'), relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [,''])[1], segments: a.pathname.replace(/^\//,'').split('/') }; }
网页页面有着ID的原素会建立全局变量
在一張HTML网页页面中,全部设定了ID特性的原素会在JavaScrip
相关文章
- 2条评论
- 弦久娇痞2022-06-02 11:59:21
- seg[i].split('='); ret[s[0]] = s[1]; } return ret; })(), file: (a.pathname.match(/\/([^\/?#]+)$/i) || [,''])[1], ha
- 痴者寻倌2022-06-02 12:36:44
- t.createElement('a'); a.href = 'http://www.cnblogs.com/wayou/p/'; console.log(a.host);运用这一基本