Bookmarklet，小书签大作用 (第5波更新, 中文网最全合集) | 奔跑中的奶酪

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

javascript:alert('Bookmarklets!')

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

例1：生成当前网页二维码
提供了生成二维码的API ”http://s./qrcode.php?url="，在 "=" 后加上文字或者网址就会生成一个二维码了。

文本二维码比如："http://s./qrcode.php?url=进来的是SB，哈哈哈哈"，你的朋友圈里是不是也经常有让你扫描二维码进群可以领红包，结果发现是恶搞的这样的戏码？
网址二维码比如："http://s./qrcode.php?url=http://www.runningcheese.com/" 生成的二维码是奶酪的博客首页。这种形式非常地常见，比如地铁里的广告，海报里的手机购物等等。

文本二维码

网址二维码

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

window.open('http://s./qrcode.php?url=' + decodeURIComponent(gBrowser.currentURI.spec));

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

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

javascript:window.open('http://s./qrcode.php?url=' + decodeURIComponent(location.href));void(0);

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

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

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

javascript:window.open('http:///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./src/bookmarklet/bookmarklet_tw.js，再比如有道全文翻译的.js文件是 http://fanyi.youdao.com/web2/seed.js