如何创建书签以覆盖外部文件中的html / div图层和CSS

我正在尝试找到一种方法来创建一个bookmarklet，它将从其他html和css加载（从外部文件）一个新的layer / div，并将其覆盖在现有页面上。

有没有人有一个书签的例子，他们可以分享吗？

我可以使用新的html内容和CSS类创建div我不知道如何编写bookmarklet和javascript / jquery函数来在现有页面之上加载新内容。

非常感谢你！

Answer 1

试试这个代码，显然它可以改进，但它的工作原理。 您必须对其进行微调，并确保在将其粘贴到浏览器地址栏之前添加“javascript：”。

javascript : (function (e, a, g, h, f, c, b, d) { if (!(f = e.jQuery) || g > f.fn.jquery || h(f)) { c = a.createElement("script"); c.type = "text/javascript"; c.src = "http://ajax.googleapis.com/ajax/libs/jquery/" + g + "/jquery.min.js"; c.onload = c.onreadystatechange = function () { if (!b && (!(d = this.readyState) || d == "loaded" || d == "complete")) { h((f = e.jQuery).noConflict(1), b = 1); f(c).remove() } }; a.documentElement.childNodes[0].appendChild(c) } })(window, document, "1.3.2", function ($, L) { //your code here (a div with some content) $("
hello world
").appendTo("body"); }); 

编辑：

这是使用iframe中嵌入的外部文档的相同代码：

 javascript:(function(e,a,g,h,f,c,b,d){if(!(f=e.jQuery)||g>f.fn.jquery||h(f)){c=a.createElement("script");c.type="text/javascript";c.src="http://ajax.googleapis.com/ajax/libs/jquery/"+g+"/jquery.min.js";c.onload=c.onreadystatechange=function(){if(!b&&(!(d=this.readyState)||d=="loaded"||d=="complete")){h((f=e.jQuery).noConflict(1),b=1);f(c).remove()}};a.documentElement.childNodes[0].appendChild(c)}})(window,document,"1.3.2",function($,L){$("
").appendTo("body");});