javascript - 如何使用 Javascript 创建工具栏/书签？

Question

您好，我是 JavaScript 新手，需要一些帮助。我正在尝试创建一个可以通过使用书签在任何网站上查看的工具栏，工具栏只是一个带有几个链接的 div。但我坚持如何实现这一目标。将不胜感激为实现这一目标提供的任何帮助。

Answer 1

大多数执行复杂操作(如“创建工具栏”)的小书签只是将外部脚本添加到调用小书签的页面。

基本上你所要做的就是写一个包含javascript的链接，这可以通过启动href=""来实现。与 javascript:

所以让我们从 href 中的脚本开始，它将向您的页面添加外部 JavaScript

addScript = function ( url ) {
    myScript = document.createElement('script');
    myScript.src = "url";
    document.head.appendChild(myScript);
};
addScript("http://google.com/");

所以如果你把它缩小到一个 url 你会得到..

<a href="javascript:addScript=function(url){myScript=document.createElement('script');myScript.src=url;document.head.appendChild(myScript);};addScript('http://google.com/');"> click to add toolbar </a>

但是你想让这个书签可用，所以我们必须添加更多的混淆......这部分必须根据浏览器以不同的方式完成

addBookmark( url, title ) {
    if (window.sidebar) { // Firefox
        window.sidebar.addPanel(url,bookmarkName,"");
    } else if(window.external) { // IE 
        window.external.AddFavorite(url,bookmarkName); 
    }
 }

您可以将其包含在您要添加书签按钮的页面上。不过有几点需要注意

1. 这在歌剧中行不通..但谁在乎歌剧
2. webkit 浏览器(chrome 和 safari)不允许 javascript 创建小书签

最后，您需要将所有内容混合成一个丑陋的链接

 <a href="javascript:addBookmark(\"javascript:addScript=function(url){myScript=document.createElement('script');myScript.src=url;document.head.appendChild(myScript);};addScript('http://google.com/');\",\"whatever you want the bookmarks name to be\")"> click to add bookmark </a>

最后，尽管我建议您考虑制作一个 Google Chrome Extension或 Firefox Plugin而不是小书签，因为您可以使用两者中的任何一个获得更多功能。

至于如何使用 JavaScript 制作工具栏，你只需要为此提出另一个问题。它太多了，你已经说了足够多的关于你想做什么的问题，我无法在这里回答.