将 Favicon 与书签一起使用

发布于 2024-10-14 02:09:27 字数 1681 浏览 10 评论 0原文

我有一个用于我的网络服务的书签。这是小书签链接的代码:(

为了可读性添加了空格)

javascript: void((function () {
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('src', 'http://www.girmiyor.co.cc/bookmarklet.js');
    document.body.appendChild(e)
})())

我想为此小书签链接添加网站图标。我找到了关于它的这篇文章

他们给出了用于添加 favicon 的示例 javascript 代码,

javascript:’<!DOCTYPE html><html><head><title>Hello World</title><link rel=”icon” type=”image/png” href=”http://www.tapper-ware.net/devel/js/JS.Bookmarklets/icons/next.png” /></head><body>Hello World</body></html>’;

我想在我的书签代码中使用此方法。我必须结合这些代码。但这不行。

可读版本

javascript: void((function () {
    document.write('<html><head><link rel=\'shortcut icon\' href=\'http://www.girmiyor.co.cc/favicon.ico\'/></head></html>');
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('src', 'http://www.girmiyor.co.cc/bookmarklet.js');
    document.body.appendChild(e)
})())

原始版本:

javascript:void((function(){document.write('<html><head><link%20rel=\'shortcut%20icon\'%20href=\'http://www.girmiyor.co.cc/favicon.ico\'/></head></html>');var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('src','http://www.girmiyor.co.cc/bookmarklet.js');document.body.appendChild(e)})())

I have a bookmarklet for my webservice. This is bookmarklet link's code :

(spaces added for readability)

javascript: void((function () {
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('src', 'http://www.girmiyor.co.cc/bookmarklet.js');
    document.body.appendChild(e)
})())

And i want to add favicon for this bookmarklet link. I found this post about it.

They give an example javascript code for adding favicon

javascript:’<!DOCTYPE html><html><head><title>Hello World</title><link rel=”icon” type=”image/png” href=”http://www.tapper-ware.net/devel/js/JS.Bookmarklets/icons/next.png” /></head><body>Hello World</body></html>’;

I want to use this method on my bookmarklet code. I have to combine this codes. But this isn't work.

readability version :

javascript: void((function () {
    document.write('<html><head><link rel=\'shortcut icon\' href=\'http://www.girmiyor.co.cc/favicon.ico\'/></head></html>');
    var e = document.createElement('script');
    e.setAttribute('type', 'text/javascript');
    e.setAttribute('src', 'http://www.girmiyor.co.cc/bookmarklet.js');
    document.body.appendChild(e)
})())

Original version :

javascript:void((function(){document.write('<html><head><link%20rel=\'shortcut%20icon\'%20href=\'http://www.girmiyor.co.cc/favicon.ico\'/></head></html>');var%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('src','http://www.girmiyor.co.cc/bookmarklet.js');document.body.appendChild(e)})())

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

南七夏 2024-10-21 02:09:27

不,它在 Chrome 中不起作用,在 Firefox 中也不能很好地工作。
到目前为止,在 Chrome 中为小书签添加图标的唯一方法是生成用户导入的书签 (.HTML) 文件,其中书签附加有图标。
这是非常痛苦的,但所有其他尝试都以某种方式失败了。

对于 chrome,生成一个包含以下内容的文件:

<!DOCTYPE NETSCAPE-Bookmark-file-1>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<TITLE>Bookmarks</TITLE>
<H1>Bookmarks</H1>
<DL><p>
    <DT><H3 ADD_DATE="1346919281" LAST_MODIFIED="1381755311" PERSONAL_TOOLBAR_FOLDER="true">Favorite</H3>
        <DL><p><DT><A HREF="javascript:(your bookmarklet here *MUST BE THE SAME AS THE BOOKMARKLET CODE*)" ICON="data:image/png;base64,your base64 encoded icon here">Your bookmarklet name here *MUST BE THE SAME AS THE BOOKMARKLET*</A>
        <DT>
    </DL><p>
</DL><p>

然后让用户将此文件另存为 mybookmark.html,然后让它导入到“收藏夹管理器”中(打开收藏夹管理器,然后右键单击根文件夹,选择“导入 HTML 书签” ...')。这是完全安全的,因为导入会进入新文件夹,并且导入后可以立即删除。

Chrome 识别出相同的 URL(JavaScript 代码)和标题,并重复使用该图标。

No it does not work in Chrome, and not well in Firefox.
Up to now, the only way to have an icon for a bookmarklet in Chrome is to generate a bookmark (.HTML) file the user is importing where the bookmark has an icon attached.
This is very painful, but all other tentatives fails somehow.

For chrome, generate a file that contains:

<!DOCTYPE NETSCAPE-Bookmark-file-1>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8">
<TITLE>Bookmarks</TITLE>
<H1>Bookmarks</H1>
<DL><p>
    <DT><H3 ADD_DATE="1346919281" LAST_MODIFIED="1381755311" PERSONAL_TOOLBAR_FOLDER="true">Favorite</H3>
        <DL><p><DT><A HREF="javascript:(your bookmarklet here *MUST BE THE SAME AS THE BOOKMARKLET CODE*)" ICON="data:image/png;base64,your base64 encoded icon here">Your bookmarklet name here *MUST BE THE SAME AS THE BOOKMARKLET*</A>
        <DT>
    </DL><p>
</DL><p>

Then let the user save this file as mybookmark.html and then let it import it in the "Favorite manager" (open favorite manager, then right click on the root folder, select 'Import HTML bookmark...'). This is completely safe as the import goes into a new folder, and it can be deleted immediately after import.

Chrome recognizes it's the same URL (the javascript code) and title, and reuse the icon.

征棹 2024-10-21 02:09:27

我认为你从那个例子中得到的完全错误。您不需要直接记录 HTML 标记。我建议您再次阅读这篇文章并了解它的分支。

如果我不更具体,我很抱歉,但我只会重复您链接的文章中已经存在的内容。

I think you got it totally wrong from that example. You don't need to document.write the HTML tags directly. I suggest you to read again the article and understand the branching it does.

I'm sorry if I'm not more specific, but I will just repeat the same that's already on the article you linked.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文