“推荐到豆瓣”的代码是比较常见的 bookmarklet , 其本质是一段可以在浏览器地址栏运行的JS代码,其代码如下:
代码的原理
- 获取目标网页的信息(包括选中的文字,网页的地址,网页的标题).
- 构建一个地址用来传递获取的信息.
- 利用第二步的地址打开一个新的窗口来触发提交服务.
Bookmarklet 的简单介绍
Bookmarklet 主要有两部分构成:
- URI scheme, 这里是 javascript (注意这里的 javascript 是一种URI scheme, 类似于http, ftp)
- JS代码
Internally, the browser sees that the specified protocol is javascript, treats the rest of the string as a JavaScript application which is then executed, and uses the resulting string as the new page
上面的引用来自 Wikipedia 的 bookmarklet 词条,从中可以看出当浏览器遇到 URI scheme 为 javascript 的时候,就会把后面的字符串当作 js 来执行,返回结果作为一个新的页面。
所以可以运行JS代码的情况可以分为下面的几种
- 作为书签, 就是所谓的 Bookmarklet
a
标签的href
属性, 一般用来模拟按钮直接在浏览器中的地址栏(现在浏览器的地址栏一般不识别javascript这个 URL scheme)(这里应该是删除线)
Bookmarklet 的编写常用模版
因为如果 bookmarklet 返回值不是 undefined 就会以返回值重载这个页面,这往往不是我们所希望的,所以我们可以使用一个没有返回值匿名的函数来实现,这样做的另一个好处就是不用担心和页面已有的变量冲突。
或者