我可以仅在浏览器窗口中的图像上调用Javascript小书签吗？ 例如：blah.com/blah.jpg？

Question

如果我使用的是网址...说说http://i.imgur.com/JcxmE.jpg ，它只是图像文件，那么当调用书签时，如何使窗口/ div出现在图像上？ Instapaper可以做到这一点。 到目前为止，我的书签加载了一个外部javascript文件，该文件又创建了一个div并将其附加到正文中。 当它只是图像时，这是行不通的。 有想法吗？ 谢谢！

Answer 1

好吧，看起来似乎不行，至少在Firefox中没有。 甚至像javascript:alert('Hello World');一样简单的东西javascript:alert('Hello World'); 在图像上不起作用。 自己尝试该代码。

Answer 2

好的，似乎Firefox即使在图像上仍然可以渲染DOM。 Hello World示例仅在将其粘贴在书签中时才有效，而在网址栏中却不行。

只要您的浏览器即使在纯图像url上呈现DOM，也可以使用以下示例。 它将图像插入容器元素内。

javascript:(function(){
  var doc = document,
      image = doc.getElementsByTagName('img')[0],
      container = doc.createElement('div');

  doc.body.removeChild(image);
  container.appendChild(image);
  doc.body.appendChild(container);
})();