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

I am trying to create a bookmarklet, so that when you click on it, it will load example.com/yourdata.php in a div box.

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

How can I make it get the data from example.com?

如何从example.com获取数据?

IFRAME? or is there a better solution?

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

4 个解决方案

#1

You may have issues with creating a bookmarklet within another page that grabs data from a different domain (to load into a <div /> using Ajax).

您可能会遇到在另一个页面中创建书签的问题,该书签从另一个域抓取数据(使用Ajax加载到

)。

Your best option is probably to insert an IFrame with the content as the source of the page.

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

If you want to do this as a very basic lightbox, you could do something like this:

如果你想做一个非常基本的灯箱,你可以做这样的事情:

(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); 

})();

And here is the same code in bookmarklet format:

以下是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); })();

You could also style this a lot more if you wanted something pretty. This is just a basic example of what is possible. As another person said, it would be easiest to make it pretty by loading jQuery using an Ajax request, but that is a little more involved.

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

#2

Do an AJAX call directly in your bookmarklet, and then set the innerHTML of your div to the returned content. Not sure if there are security restrictions on this or not.

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

Edit: You don't want to use JQuery, as you can't easily load a javascript library from a bookmarklet. (Although maybe you could get it via AJAX and then eval it...)

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

You need to do a classic XMLHttpRequest.

您需要执行经典的XMLHttpRequest。

Some more info here.

这里有更多信息。

#3

With The Dojo Toolkit you can use dijit.layout.ContentPane or dojox.layout.ContentPane to do exactly what you want in one single div.
The difference between dijit.layout.ContentPane and dojox.layout.ContentPane is that you can run inline javascript inside the dojox.layout.ContentPane.

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

#4

I got around the domain restriction by making a php function on my server that outputs a page on another domain. that way, javascript thinks it is in the same domain when I do an ajax.updater call.

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

$sSrcPage = $_REQUEST['SrcPage'];

$ sSrcPage = $ _REQUEST ['SrcPage'];

echo file_get_contents($sSrcPage, 0);

echo file_get_contents($ sSrcPage,0);

#1