新建一个浏览器书签。书签网址输入 javascript: 伪协议编写的代码。
在需要的时候只要点击书签，就可以快速帮我们完成很多事情。（细节参考上一篇博客 这可能是最简单的b站封面提取教程）
之前，我们只提到 b 站相关的几段代码，现在继续介绍任何网站通用的一些书签。
语音合成
新建一个书签，网址如下，名称随便起。需要时点一下，并在弹出一个对话框输入一句英文，它就会自动生成这句话的音频。可播放，可下载。
地址:
javascript:window.location.href=`http://tts.youdao.com/fanyivoice?word=${encodeURIComponent(prompt('输入一句英文'))}`值得注意的是，因为用到 location 属性，所以该书签须在一个非空白页点击才生效
网页翻转
这是一个恶搞书签，点击后会让你的页面旋转 180°，向下滚动网页会上翻，向上滚会下翻。
地址：
javascript:document.body.style.cssText+="transition:all 3s ease-in;transform: rotate(180deg);";void(0);rewrite（网页编辑）
新建一个地址如下的书签，点击后你可以在你的浏览器内任意编辑网页的内容。
虽然不是 100%，但几乎你能看到的任何文本，都能被改写。
地址：
javascript:document.body.contentEditable='true'; document.designMode='on'; void(0);
以前我们都说无图无真相，现在图片都不能为证了
让图片飞
可以让当前页面所有图片飞出原来的位置，然后沿一定的轨迹移动。同样属于恶搞，刷新可以恢复正常。
地址:
javascript:R=0; x1=.1; y1=.05; x2=.25; y2=.24; x3=1.6; y3=.24; x4=300; y4=200; x5=300; y5=200; DI=document.getElementsByTagName("img"); DIL=DI.length; function A(){for(i=0; i-DIL; i++){DIS=DI[ i ].style; DIS.position='absolute'; DIS.left=(Math.sin(R\*x1+i\*x2+x3)\*x4+x5)+'px'; DIS.top=(Math.cos(R\*y1+i\*y2+y3)\*y4+y5)+'px'}R++}setInterval('A()',5); void(0);网站解析
有些网站，直接修改地址栏的域名再回车都会跳到非官方的解析站点，然后获取被限制的资源
如果你不希望每次都要开一个新窗口，然后复制粘贴当前的地址，甚至连特殊域名都懒得记。这些操作都可以用书签代替。比如：
百度文库下载：
javascript:window.open(window.location.href.replace('baidu', 'baiduvvv')) 视频解析下载：
javascript:window.open(`http://www.flvcd.com/parse.php?kw=${encodeURIComponent(window.location.href)}`) b站工具集：
javascript:window.open(window.location.href.replace('bilibili', 'ibilibili')) ......
这个定制性很高，有一点编程基础的随便改。
小游戏
这是一个国外的作品，他会在页面生成一只小飞机，按左右调整机身角度；按上前进或加速；按空格可以控制飞机发火，但凡子弹击中的页面元素(比如文字，图片，视频等) 都会消失。
游戏通关目标很简单，扫荡网页上的一切元素。每一个网站，就是一道关卡。
地址:
javascript:var s = document.createElement('script');s.type='text/javascript';document.body.appendChild(s);s.src='https://hi.kickassapp.com/kickass.js';void(0);
通过这个书签，其实我们可以发现一点。就是通过代码书签创建 script，并把地址指向外链这种形式，理论上可以写任意复杂的脚本。之前 这篇博客 中，我分别写了一个实时弹幕脚本和视频弹幕替换脚本，就是用的此技巧。
聊天室
这是 b 站一个 up 主 icheer 的作品，给任意网站加入聊天室功能。
点击这个书签，你就可以和现在正跟你浏览相同网站的人聊天。
非常有趣的功能。作者专门为它出了一期视频，感兴趣的可以看看
地址:
javascript:var s=document.createElement('script');s.src='//topurl.cn/chat.js';document.body.append(s);data 协议
除了 javascript 伪协议之外，data 协议也有用武之地。
比如:
最简记事本：
data:text/html, <html contenteditable>计算器(输入表达式后回车):
data:text/html, <html contenteditable><script>document.addEventListener('keydown', e => {e.keyCode === 13 && alert(document.documentElement.innerText + '=' + eval(document.documentElement.innerText))})</script>文字加密(这是一个没有特征码的磁链):
data:text/html, <script>document.write(atob("bWFnbmV0Oj94dD11cm46YnRpaDpDMTRDM0Y3NkQ1QzgzODQwQThEMENFNUQ0QUNCQTUzN0Y5Qzg3NDEw"))</script>
......
可以发现， data 协议的以创建一个网页，网页内容可以自定义。比如这样
data:text/html,<html>hello world</html>还记得之前在一篇博客 二维码算法设计——url 如何以图像形式编码/解码 ，我一直有一个未解的疑问：那些扫一下二维码，就能出现一个自定义网页的到底是怎样实现？即如何用二维码编码一个特定网页?
现在根据这点，终于可以给出自己的方案——用 data 协议封装一个自定义网页，然后当成 url 传给解析器编码即可。
暂无评论