Question

我正在尝试创建一个bookmarklet，这样当你点击它时，它会在div框中加载example.com/yourdata.php。

如何从example.com获取数据？

IFRAME？还是有更好的解决方案？

Answer 1

您可能在另一个页面中创建书签时遇到问题，该书签从另一个域抓取数据（使用Ajax加载到<div />）。

您最好的选择可能是插入一个IFrame，内容作为页面的来源。

如果您想将此作为一个非常基本的灯箱，您可以这样做：

(function() {

    var iFrame = document.createElement('IFRAME');

    iFrame.src = 'http://google.com';
    iFrame.style.cssText = 'display: block; position:absolute; ' 
                         + 'top: 10%; left: 25%; width: 50%; height: 50%';

    document.body.insertBefore(iFrame, document.body.firstChild); 

})();

以下是bookmarklet格式的相同代码：

javascript: (function() { var iFrame = document.createElement('IFRAME'); iFrame.src = 'http://google.com'; iFrame.style.cssText = 'display: block; position:absolute; top: 10%; left: 25%; width: 50%; height: 50%'; document.body.insertBefore(iFrame, document.body.firstChild); })();

如果你想要一些漂亮的东西，你也可以设计更多样式。这只是可能的基本示例。正如另一个人所说的那样，通过使用Ajax请求加载jQuery来实现它是最容易的，但这需要更多一些。

Answer 2

直接在书签中进行AJAX调用，然后将div的innerHTML设置为返回的内容。不确定是否存在安全限制。

编辑：您不想使用JQuery，因为您无法从书签中轻松加载JavaScript库。（虽然也许你可以通过AJAX获得它然后评估它......）

你需要做一个经典的XMLHttpRequest。

一些more info here。

Answer 3

使用 The Dojo Toolkit ，您可以使用 dijit.layout.ContentPane 或 dojox.layout.ContentPane 来完成您想要的工作在一个单独的div dijit.layout.ContentPane和dojox.layout.ContentPane之间的区别在于你可以在dojox.layout.ContentPane中运行内联javascript。

Answer 4

我通过在我的服务器上创建一个在另一个域上输出页面的php函数来解决域限制问题。这样，当我进行ajax.updater调用时，javascript认为它在同一个域中。

$ sSrcPage = $ _REQUEST ['SrcPage'];

echo file_get_contents（$ sSrcPage，0）;

如何让javascript加载另一个html文件？

4 个答案: