将图标添加到javascript书签(使用window.open) [英] Adding favicon to javascript Bookmarklet (uses window.open)
问题描述
我有一个可启动window.open javascript函数的书签，可以用我的书签打开一个小窗口-一种用于在任何访问的站点与我的服务器之间进行通信的外部功能.我希望在将书签添加到书签工具栏时显示一个 favicon .我意识到小书签是javascript，没有与之相关的域，因此实现此目标将很困难或不可能.
I have a bookmarklet that launches a window.open javascript function to open a small window with my bookmarklet -- an external feature used to communicate between any visted site and my server. I'd like for a favicon to show up when the bookmarklet is added to the bookmark toolbar. I realize that the bookmarklet is javascript, there is no domain tied to it so it's going to be either difficult or impossible to achieve this goal.
我对问题的理解:
图标易于理解，是HTML文档开头的链接.当通过引用将实际站点添加为书签时，浏览器可以拉出该标签.但是，如您所见，我的书签是从没有HTML的javascript启动代码中删除的，因此没有指向收藏夹的链接.我还没有准备好放弃，我觉得可以进行一些注射...
Favicons are easy to understand, a link within the head of an HTML doc. The browser can pull this when bookmarking an actual site by reference. However, as you see my bookmarklet is ran off a javascript launch code where there exists no HTML, therefor no link to a favicon. I'm not ready to give up yet though, I feel that there's some injection that can be made...
截至目前，小书签启动代码如下:
As of now, the bookmarklet launch code looks like this:
当前脚本-小书签，无图标(请注意，所有代码均以换行符格式设置-不适用于所有浏览器，通常只能使用一行)
javascript:void(window.open(
'http://mydomain.com/bookmarklet/form?u='
+encodeURIComponent(location.href)+
't='+encodeURIComponent(document.title),
'test','status=0,toolbar=0,location=0,menubar=0,
resizable=false,scrollbars=false,height=379,width=379'
));
我找到的最接近解决方案的内容如下，但是它没有打开新窗口-只是创建一个以html为页面的新标签页:
The closest thing I've found to a solution is as follows, but it doesn't open a new window -- just creates a new tab with the html as the page:
工作图标，没有书签窗口
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 have tried a combination of the two but it didn't seem to use the icon. I'd be curious to know if anyone can see a type of workaround.. I think it could be possible, I just don't think it's set up correctly as I've been trying.
我的两者的混合体-小书签，但没有收藏夹图标
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>';
window.open('http://mydomain.com/bookmarklet/form?u='
+encodeURIComponent(location.href)+
'&t='+encodeURIComponent(document.title),
'test',
'status=0,toolbar=0,location=0,menubar=0,resizable=false,
scrollbars=false,height=379,width=379').void(0);
我所做的是在触发window.open()之前使用html结构，这成功在新窗口中打开了我的小书签，但是没有显示书签图标的图标.
What I did was use the html structure before firing window.open(), this successfully opened my bookmarklet in a new window, but no favicon showed up for the bookmark icon.
逻辑解决方案:
对此，我的想法是使小书签指向一个页面，该页面只是一个带有favicon链接和<head>中的启动脚本的HTML文件.但是，我不希望在带有空白HTML文件的新标签页中打开该文件，然后启动弹出窗口.解决方法..?
My thoughts on this would be to have the bookmarklet point to a page that is simply an HTML file with a favicon link and the launch script in the <head>. However, I don't want this opening in a new tab with a blank HTML file that then launches a popup.. Workaround..?
存在类似的问题，但我似乎没有找到想要的答案:
There exists a similar question but I did not seem to find the answer I'm looking for:
可运行的javascript网站图标的来源(不过，没有书签):
Source for the working javascript favicon (no bookmarklet however):
http://www.tapper-ware.net/blog/?p = 97
我会对您目前在这方面的知识/想法感兴趣
I'd be interested in what your current knowledge/thoughts on this would be
推荐答案
我尝试过的某些事情可能会使您走得更远:
Some of the things that I've tried that might possibly get you going a bit more:
将新的链接元素添加到当前文档:
Append a new link element to the current document:
javascript: var newLink = document.createElement('link');
newLink.setAttribute('rel','icon');
newLink.setAttribute('type','image/png');
newLink.setAttribute('href','http://www.tapper-ware.net/devel/js/JS.Bookmarklets/icons/next.png');
document.querySelector('head').appendChild(newLink);
void(0);
请注意，由于IE测试，我使用的是querySelector(尽管在现代浏览器中也可以使用).使用Chrome和FF，在尝试创建元素时，我一直收到无效字符，因此我必须进行分段属性设置.
Note that I was using the querySelector due to IE testing (though works in modern browsers as well). With Chrome and FF, I kept getting invalid character when trying to create the element, so I had to do piecewise attribute setting.
使用"data:image/png; base64，iVBORw0KGgoAAAA ..." URI模式尝试使用base64编码的图像字符串，但是由于我仍然必须将其设置为当前HTML，因此没有任何帮助文字(我可以这样做，但遇到了与您相同的问题，没有书签).
Tried using base64 encoded image string using the "data:image/png;base64,iVBORw0KGgoAAAA..." URI schema, but that didn't help anything due to the fact that I still had to set it to the current HTML text (which I could do, but ran into the same problem as you above of no bookmarklet).
也许由于跨站点脚本问题而无法做到这一点?不确定...不管哪种方式，真的很想知道您的想法(如果您想出任何办法).
Maybe this can't be done due to cross site scripting concerns? Not sure... Either way, really curious to see what you come up with (if you manage to come up with anything).
这篇关于将图标添加到javascript书签(使用window.open)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
