向收藏夹添加一个插入javascript的按钮

Question

我看到一些网站提供了一个工具，允许用户将一个按钮拖到他们的收藏栏上，然后当他们点击它时，无论他们在哪个网站，页面上都会弹出一个某种形式的div。当我看到我拖到收藏夹栏上的按钮的url时，我意识到它实际上是javascript代码。

这个效果是如何实现的?

Answer 1

这叫做"bookmarklet"。您可以创建一个包含必要JavaScript代码的超链接，他们可以将其拖放到书签工具栏中。

这就像在包含JavaScript作为href的页面上创建一个超链接一样简单。例如:

<a href='javascript:alert("you clicked a bookmarklet");'>Drag me to your bookmarks</a>

查看JSFiddle…

为了使它看起来像一个按钮，应用了CSS(边框、背景色等)。

Answer 2

试着在浏览器的位置栏中输入这个，当你按return时，javascript将自动执行:

javascript:alert('hi');

Bookmark 'scriptlets'使用相同的概念。如果您的页面上有以下<A>标签:

<a href="javascript:alert('hi');" >Hello Scriptlet</a>

你把它拖到书签栏上，你将创建一个具有相同行为的scriptlet