各种骚操作，中文网最全Bookmarklets小书签合集

导读

拓展是我们使用浏览器时必不可少的一部分，它可以帮助我们实现各种各样的功能。但不足也是有的，比如安装过多的拓展就会导致浏览器变慢，很多时候我们为了一个很小的功能而不得不多安装一个拓展。而且拓展开发难度大，是开发者们的事，一般用户没办法自定义拓展的功能，只能有什么就用什么。

有一种叫「小书签 Bookmarklet」的书签应用正好弥补了拓展的不足。它无需安装，不会对浏览器速度造成任何的影响。它和普通的书签一样被放到书签栏里，只需要点击一下就可以实现各式各样的功能，比如生成二维码，生成短链接，阅读模式等等功能，而且它还支持在手机浏览器上使用，可以称得上是“屠龙宝刀，点击就送”。

一、如何使用小书签？

小书签又名 Bookmarklet，由英文单词 Bookmark 和 Applet 组合而来。简单地说，小书签就是把一段带有特定功能的 JavaScript 代码保存至收藏夹，当你需要的时候点击它来实现这段 JavaScript 代码的功能。

1、在 Firefox 浏览器上使用小书签

以「B站视频解析」为例，除了打开书签栏点击小书签外，我们可以为小书签设置一个关键词，在浏览器地址栏输入关键词 bbd（bbd 表示 bilibili download），回车，就可以解析下载 Bilibili 视频了。同理，将「网页另外为PDF」设置关键字为 "pdf"，就可以快速调用小书签了。

2、在 Chrome 浏览器上使用小书签

因为 Chrome 浏览器不支持书签设置关键词，所以在 Chrome 上使用小书签，除了在书签栏上点击小书签外，我们还可以在 chrome://settings/searchEngines 上手动添加，设置关键字后就可以像 Firefox 那样调用小书签了。

二、中文网最全小书签合集

使用方法：将小书签拖入书签栏，点击即可使用。（文末附打包下载）

[tabgroup]
[tab title="工具类" id="tool"]

1. VIP视频免费观看，测试页面：点这里
2. 视频解析下载，除优酷外，支持国内大多数视频网站。
3. 视频解析下载(优酷)，暂时没做成小书签，需要手动输入地址。
4. 随机打开网站，网站被墙，需要科学上网。
5. 查找网站RSS源，任意有RSS的网站都可使用，测试页面就用奶酪的博客吧
6. 网页另存为PDF，可惜有水印。
7. 弹出软键盘，如题。
8. WP一键留言， 需要修改成自己的名字，邮箱和内容。测试页面：点这里。
9. 摧毁网站，加载可能较慢。
10. 网页地震，让网页抖动起来。
11. 网站涂鸦，可以涂鸦后再截图。
12. 显示当前时间，如题。
13. 今年还剩多久?，如题。
14. 查看浏览器UA，如题。
15. 显示网页最后更改时间，如题。
16. 百度云直链，去百度网盘调用百度云管家，实现直链下载。
17. 百度网盘提取码自定义，使用方法：点这里。
18. 购物·购物党，不用多说，购物比价，测试页面：点这里。
19. 购物·如意淘，如上。
20. 购物·惠惠购物，如上。

[/tab]
[tab title="阅读类" id="layout"]

1. 自动滚屏，按Esc键停止。
2. 自动刷新，支持自定义时间。
3. 阅读模式，进入阅读模式。
4. 夜间模式，降低网页亮度，再次点击取消。
5. 高亮关键词，如题。
6. 简单记事本，生成一个记事本。
7. 改变文字颜色，可以在小书签中修改颜色，支持HTML颜色值。
8. 显示明文密码，去掉登录界面的密码星星，显示实际的密码。测试网站：点这里。
9. 水平分屏浏览，需要输入另一个地址，不输入则是同一个网页。
10. 垂直分屏浏览，如上。
11. 限制网页宽度，如题。
12. 关键词密度查询，如题。
13. 给表格添加边框，给一些隐藏了边框的表格加上边框，方便查看。测试页面：点这里。
14. 下拉菜单转列表，测试页面：点这里。

[/tab]
[tab title="链接类" id="link"]

1. http 转 https，普通链接转加密链接。
2. 当前网页短网址，如题。
3. 生成二维码(页内)，在https加密页面可能无法使用。
4. 生成二维码(弹窗)，如上。
5. 文本链接转超链接，如题。
6. 网页地址到根目录，如题。
7. 网页地址向上一层，如题。
8. 网页地址数字+1，如题。
9. 网页地址数字-1，如题。
10. 高亮显示链接，如题。
11. 显示链接详情，鼠标移至链接会显示链接的详情。
12. 显示出站链接，列出所有域名。
13. 显示邮箱地址，如题。
14. 显示所有链接，如题。
15. 显示所有链接(含图片)，如题。
16. 显示当前页标题和地址，如题。
17. 生成网页HTML代码，如题。
18. 生成图片HTML代码，如题。
19. 设置链接在新网页打开，如题。
20. 设置链接在当前页打开，如题

[/tab]
[tab title="图像类" id="images"]

1. 谷歌以图搜图，点击需要搜索的图片后进行以图搜图。
2. 天眼以图搜图，如上。
3. 显示丢失图片，如题。
4. 移除所有图片，如题。
5. 显示所有图片，如题。
6. 修改背景图片，需要图片的地址。
7. 显示背景图片，如题。

[/tab]
[tab title="翻译类" id="translate"]

1. 繁体转为简体，如题。
2. 简体转为繁体，如题。
3. 文本翻译为中文，如果粘贴板上有内容则翻译粘贴板上的内容，没有的话则需要输入文字进行翻译。
4. 文本翻译为英文，如上。
5. 有道全文翻译，页内全文翻译，国内最好用的全文翻译。
6. 谷歌全文翻译，可以会比较慢地才显示翻译工具栏。
7. 百度全文翻译，如题。
8. 谷歌全文翻译，如题。
9. 谷歌选词翻译，选定文本进行翻译，默认翻译成中文。
10. 必应划词翻译，如题。
11. 海词划词翻译，如题。
12. 小D划词翻译，如题。
13. 汉典划词解释，中文词典。
14. 词霸划词翻译，如题。

[/tab]
[tab title="搜索类" id="search"]

1. 谷歌搜索，如题。
2. 谷歌站内搜索，输入关键字搜索当前网站的内容。
3. 百度搜索，如题。
4. 百度站内搜索，如上。
5. 维基中文搜索，如题。
6. 维基英文搜索，如题。
7. 相似网站查找，如题。
8. 搜索共享帐号，比如一些论坛下载需要帐号才能下载，这时这个功能可能会帮到忙，选择投票率最高的。。
9. 谷歌缓存查询，比如一些网页已经打不开或者删除了，使用缓存查询功能则可以再次浏览。
10. about:config搜索，只适用于Firefox，设置本小书签的关键字为"cf"，然后在地址栏输入cf，则会进行搜索。
11. 英文字典搜索，英文类字典搜索。
12. 英文缩写搜索，如题。
13. 英文同义词搜索，如题。
14. 英文俚语词典搜索，中文里的 no zuo no die 也能搜索到。。。

[/tab]
[tab title="开发类" id="developer"]

1. 编辑当前页面，可以对当前网页进行编辑，按Ecs键退出，什么支付宝余额修改然后截图装逼这种事实在太Low了。
2. 解除选择复制限制，如题。
3. 解除右键菜单限制，如题。
4. 解除复制和右键限制，测试网页 点这里 或者 这里，可能是中文网页上唯一能用的解除限制小书签。
5. 查看JS变量与函数，如题。
6. 查看当前窗口大小，如题。
7. 查看当前网页信息，会显示当前网页所有的JS和CSS文件。
8. 查看网页Meta元素，如题。
9. ASCII码对照表，如题。
10. 生成HTML表格，如题。
11. FireBugLite，Firebug精简版。
12. PrintWhatYouLike，对网页的内容进行删减，然后进行打印。
13. 屏幕尺子，V系列Firefox用户需要暂时停用Grab and Drag拓展。
14. 字体查询，速度可能比较慢，点击网页指定文本就会显示是什么字体了。
15. 地形图查看，如题。
16. 网页测量工具，如题。
17. RGB to Hex，如题。
18. Hex to RGB，如题。
19. 216种标准色，如题。

[/tab]
[tab title="站长类" id="master"]

1. IP地址查询，如题。
2. SEO查询，网站SEO情况综合查询。
3. WOT查询，查询网站是否是可信赖。
4. Alexa查询，网站流量全球综合排名。
5. Whois查询，网站所有者信息查询。
6. Buildwith查询，查询网站用什么程序和主题建成的。
7. W3C Link查询，检查网站所有的链接。
8. W3C CSS查询，检查网站CSS是否存在错误。
9. W3C Html查询，检查网站HTML是否存在错误。
10. 网站收录查询，如题。
11. 反向链接查询，如题。
12. 网站时光机，需要科学上网，想知道优酷网在2008年8月8日长什么样就需要这个功能了。
13. 打开速度检测，如题。
14. 正常访问检测，联接不稳定，可能需要科学上网。。。。
15. 网站易用性评估，如题。
16. 网站黑名单检测，如题。
17. 网站安全评级，如题。
18. 网站病毒扫描，如题。
19. 网站SSL检测，如题。
20. 头部信息检测，如题。

[/tab]
[tab title="分享类" id="shareto"]

1. 分享当前页面，见过最好的网页分享小书签，会根据网页的语言自动优先显示什么样的分享网站，支持网站搜索。
2. 分享当前页面(中文)，如上，专注于中文网站的分享。
3. 收藏到Evernote，如题。
4. 收藏到Onenote，如题。
5. 收藏到百度相册，如题。
6. 收藏到百度云，如题。
7. 收藏到云笔记，如题。

[/tab]

[tab title="小书签工具" id="bookmarklets"]

1. 小书签生成器1，小书签制作生成器，如果你掌握了一些JS知识，制起来就很容易了。
2. 小书签生成器2，如上。
3. 小书签生成器3，如上。
4. 小书签调试工具，如题。
5. 小书签合并工具，如题。
6. 小书签转chrome拓展，如题。
7. Quix，超级小书签，功能很多。

值得一提：
网站w-shadow.com是一个能提供小书签一键化合并的网站。假定我们已经知道了"解除选择复制限制" 和 "解除右键菜单限制"， 但实际操作过程中需要这两个小书签同时运行，借助网站的合并功能可以同到小书签"同时解除复制和右键限制"的小书签。(可能是目前网上唯一能用的解除复制和右键限制小书签。)
使用方法：[参考这里] 。
解除复制和右键限制小书签是否生效测试网站：测试网站1 测试网站2

可能需要的Javascript知识：
Core JavaScript 1.5 Guide
JavaScript.com
JavaScript FAQ
W3CSchool

为什么在一些网页，点击小书签后没有反应？
在一些严格加密的https网页里，浏览器默认启用了 CSP （内容安全策略） ，禁用了跨站脚本，而小书签本身就是脚本，故而小书签不起作用了。解决方法是禁用 CSP，但这么做可能会引起一些安全隐患，如果你不是“高级玩家”，不建议这么做。

Firefox 的解决方法是在 about:config 中将 security.csp.enable 设置为 false，刷新后即可使用。启用小书签后可再将 security.csp.enable 设置为 true，重新启用CSP安全组策略。

[/tab]

[/tabgroup]

三、如何制作小书签？

那么，小书签里像是乱码的符号倒底是什么？小书签里的 JavaScript 代码是经过编译转码的，所以看上去有很多符号，像乱码一样，我们可以借助转码工具来得到它原来的代码。以"谷歌站内搜索" 小书签为例，经过转码美化的代码便易于理解了。


有了上面的理解，我们就可以编辑和制作小书签了， 小书签的实质其实就是一段JavaScript代码，其格式就是："javascript: + 一段JS代码"，好比这一段最简单的小书签代码：

javascript:alert('Bookmarklets!')

试试复制并粘贴到地址栏中或者 点击这里运行，下面我们再举多几个例子。


例1：生成当前网页二维码
api.qrserver.com提供了生成二维码的API ”https://api.qrserver.com/v1/create-qr-code/?size=300x300&data="，在 "=" 后加上文字或者网址就会生成一个二维码了。

文本二维码比如："https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=进来的是SB，哈哈哈哈"，你的朋友圈里是不是也经常有让你扫描二维码进群可以领红包，结果发现是恶搞的这样的戏码？

网址二维码比如："https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=https://www.runningcheese.com/" 生成的二维码是奶酪的博客首页。这种形式非常地常见，比如地铁里的广告，海报里的手机购物等等。

文本二维码

网址二维码

1. 根据jiathis.com的二维码的API和JavaScript相关知识，我们可以得到这样的js代码：

window.open('https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=' + decodeURIComponent(gBrowser.currentURI.spec));

后面的decodeURIComponent(gBrowser.currentURI.spec) 是一个变量，意思是当前网页的地址。

2. 注意此时的代码是js代码，还并不是小书签的代码，经过小书签特有的以javascript:开头的格式转换后，可以得到：

javascript:window.open('https://api.qrserver.com/v1/create-qr-code/?size=300x300&data=' + decodeURIComponent(location.href));void(0);

3. 如果小书签代码里有"#"或者空格等特殊字符时，传递参数时会被截断，小书签也有就不起作用了，因此我们需要借助URL转码工具对代码进行编码，得到：

javascript:window.open('https://api.qrserver.com/v1/create-qr-code/?size=300x300&data='%20+%20decodeURIComponent(location.href));void(0);

4. 将其保存到书签后就成功完成了小书签的制作。举一反三，再比如生成当前网页地址的短网址API是 "http://tinyurl.com/create.php?url="，我们只需要将上面的小书签代码稍稍改写一下就可以得到生成当前网页短网址小书签了：

javascript:window.open('http://tinyurl.com/create.php?url='%20+%20decodeURIComponent(location.href));void(0);



例2：当前网页中加载一条现成的.js文件
平时我们访问一些网站时，选中文字会自动触发"复制"，"搜索"或者"翻译"等功能，其原理是该网而加载了一条用于"复制"，"搜索"或者"翻译"的.js文件，根据这个思路，我们可以将这些功能移植到其他的网页上去。

1. 以沪江网划词翻译的js文件为例，在网页中加载一条.js文件的js代码是：

(function() {var element=document.createElement('script'); element.setAttribute('src', 'http://dict.hjenglish.com/app/js/dict_ajax.js'); document.body.appendChild(element);})

2. 把js代码转化为小书签代码后得到：

javascript:void((function() {var element=document.createElement('script'); element.setAttribute('src', 'http://dict.hjenglish.com/app/js/dict_ajax.js'); document.body.appendChild(element);})())

3. 将其保存到书签就完成了小书签的制作。

4. 举一反三，我们只需要更改 "http://www.某网站.com/某文件.js" 文件地址就可以了。比如同文堂简体转化为繁体的.js文件是 http://tongwen.openfoundry.org/src/bookmarklet/bookmarklet_tw.js，再比如有道全文翻译的.js文件是 http://fanyi.youdao.com/web2/seed.js


例3：如何小书签将繁体中文的网页全部自动变成简体中文？
如上面所说，有一些专门的翻译js文件做成小书签后，需要手动点击才会启用，那如何自动启用翻译js文件呢？我们可以利用“用户脚本”来实现，用户脚本拓展推荐使用 Violentmonkey。以在拓展中加入如下代码即可，原理就是自动加载这个js文件。

// ==UserScript==
// @name Auto Simplified Chinese
// @namespace no
// @description 自动将网页翻译为简体中文
// @run-at document-idle
// @require https://git.oschina.net/runningcheese/JiathisQR.js/raw/master/bookmarklet_cn.js
// @grant none
// @include https://www.runningcheese.com/*
// ==/UserScript==
(function() {
var s = document.createElement('script');
s.setAttribute('src', '@require');
document.body.appendChild(s);
})()

例4：如何让网页自动加载某个小书签？
小书签和用户脚本效果相同，但小书签是手动的，用户脚本是自动的，我们可以将小书签改写成用户脚本，方法是：

// ==UserScript==
// @name 从小书签改写到用户脚本
// @namespace none
// @description 从小书签改写到用户脚本
// @run-at document-idle
// @grant none
// @include https://www.runningcheese.com/*
// ==/UserScript==
location.href = "javascript:(function(){alert('Hello Cheese!');})();";

也就是把小书签的地址替换上面代码中双引号之间的内容，javascript:(function(){alert('Hello Cheese!');})(); 这一段。一些比较复杂的小书签无法直接用替换双引号之间内容的方法，因此我们还是需要借助URL转码工具对小书签的内容进行解码。

结尾

1. 奶酪制作、修复和收集了可能是国内最全的小书签合集。同时为了方便识别，html文件也都已经添加上了icon图标。
2. 关注 公众号（ID：runningcheese01）回复关键字“小书签”即可获取“HTML版小书签”。
3. 最后更新：2019-01-20，第8次更新
4. 首次更新：2015-11-25，第1次更新
注：本文由 奔跑中的奶酪 作者：奔跑中的奶酪 发表，其版权均为作者所有，如需转载，请注明作者名字以及文章来源。