Question

（问题改进）

您好，我正在尝试制作书签。 Bookmarklet将被覆盖，并将打开页面的右上角。你可以看到书签类型[这里] [1]我想制作叠加界面。

这是我的bookmarklet的javascript代码：

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

Bookmarklet将调用bookmarklet.js文件。 bookmarklet.js的内容：

document.body.innerHTML += "<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js'></script>";

document.body.innerHTML += "<div class='result' style='background-color:grey;z-index:1000;position:absolute;right:0;top:0' width='300' height='250'></div>";



var site = location.href;

    $.get("http://www.girmiyor.co.cc/c.php",{ q: site}, function(data){
                        $('.result').html(data);
                });

GET请求发送我可以通过Firebug看到它。但没有回来。

你能帮助我吗？

Answer 1

仔细看看你提到的friendfeed bookmarklet;它所做的就是创建并附加一个新的脚本标签，该标签包含带有“真实”功能的js文件。你提到的文章也是一样的。基本（漂亮的自我解释）方法是：

e=document.createElement('script');
e.type='text/javascript';
e.src='http://domain.tld/file.js'; //optionally pass GET params
document.getElementsByTagName('head')[0].appendChild(e); //optionally, you could append to the <body>

如果您仔细查看此方法包含的文件，您可以看到叠加层的构造方式。我粘贴了friendfeed file的重要片段，其中叠加div定位，查找该部分并进行研究：

// Create the share dialog in the corner of the window
var container = div();
container.id = "ff__container";
container.style.position = "absolute";
container.style.top = scrollPos().y + "px";
container.style.right = "0";
container.style.width = "auto";
container.style.zIndex = 100000;

所以我建议您创建一个单独的js文件，其中包含构建叠加层的函数，并让您的bookmarklet加载该文件。

Answer 2

当我直接在firefox的书签中添加此代码，然后单击返回页面并 [object XMLHttpRequest]

这是bookmarklet的常见问题。要解决这个问题，请在书签代码的末尾添加void(0);。这样，书签就不会返回任何将在浏览器中显示的值。

Answer 3

您的bookmarklet.js的当前版本已损坏（因为我正在撰写此答案）因为在var data =之后缺少引号。

从那里开始，我有几个未经考验的理论关于你的问题：

您正在替换运行自己脚本的body innerHTML。到脚本完成时，jQuery甚至还没有加载。您可能必须暂停脚本的执行并等待jQuery加载。尝试将$.get()放在window.setTimeout()之后调用的函数中，最好检查是否存在$（带typeof($) != 'undefined'）并等待更多或运行你的$.get()。
您正在通过HTTPS加载jQuery，因此浏览器策略可能会阻止$.get从HTTP获取内容
将jQuery <script>引用的type属性设置为text/javascript应该不是您的问题，但绝对不会让您感到伤心。

创建书签

3 个答案: