# 浏览器地址栏运行 JavaScript 代码

比如在地址栏输入以下代码然后回车运行,会弹出窗口。

javascript:alert('hello from address bar :)');

# 浏览器地址栏运行 HTML 代码

比如在地址栏输入以下代码然后回车运行,会出现指定的页面内容。

data:text/html,<h1>Hello, world!</h1>

# 把浏览器当编辑器

还是浏览器地址栏上做文章,将以下代码贴到地址栏运行后浏览器变成了一个原始而简单的编辑器,与 Windows 自带的 notepad 一样,吼吼。

data:text/html, <html contenteditable>

归根结底多亏了 HTML5 中新加的 contenteditable 属性,当元素指定了该属性后,元素的内容成为可编辑状态。

推而广之,将以下代码放到 console 执行后,整个页面将变得可编辑,随意践踏吧~

document.body.contentEditable='true';

# 隐藏鼠标

*{
	cursor: none!important;
}

# 简单的文字模糊效果

p {
	color: transparent;
 	text-shadow: #111 0 0 5px;
}

# console.table

可以将 JavaScript 关联数组以表格形式输出到浏览器 console

var data = [{'品名': '杜雷斯', '数量': 4}, {'品名': '冈本', '数量': 3}];console.table(data);

# 禁止别人以 iframe 加载你的页面

下面的代码已经不言自明了,没什么好多说的。

if (window.location != window.parent.location) window.parent.location = window.location;

参考链接:

浏览器地址栏运行 JavaScript 代码 - 一坪海岸线 y - 博客园 (cnblogs.com)