Question

我正在为客户端包含HTML文件寻找轻量级方法。特别是，我想在第三方网页上启用客户端包含researchr.org的发布页面。例如，我想导出一个像

这样的页面

http://researchr.org/profile/eelcovisser/publications

（可能只是该页面的出版物框。）

使用iframe可以包含HTML页面：

<iframe class="foo" style="height: 50em;" width="100%" frameborder="0"
   src="http://researchr.org/profile/eelcovisser/publications">
</iframe>

但是，iframe需要指定固定高度，而我导出的页面没有固定高度。结果有一个丑陋的滚动条：

http://swerl.tudelft.nl/bin/view/EelcoVisser/PublicationsResearchr

我找到了一个看似吸引人的方法的引用

http://www.webdeveloper.com/forum/archive/index.php/t-26436.html

它使用iframe导入html，然后使用包含文档的javascript调用到包含文档中定义的函数，该函数将包含文件的正文内容放在包含文件的div中。这在我的场景中不起作用，可能是由于javascript的原始策略相同，即包含和包含的页面不是来自同一个域（这是整点）。

解决这个问题的想法？这可能是：

一个CSS技巧，使iframe的高度变得灵活
一种javascript技术，用于将iframe的内容提升到包含页面中的div
我忽略了一些其他方法

要求：要包含的代码应该是最小的。

Answer 1

没有。同源政策阻止你做任何这些事情（并且正确地）。您必须转到服务器端，让服务器上的脚本访问该页面并将其内容复制到您自己的页面中（优选在构建时/后台;您可以在访问时或通过AJAX执行此操作但是在您的服务器和他们的服务器之间会涉及大量的抓取流量，这可能不受欢迎。

或者只是忍受滚动条或使iframe非常高。

Answer 2

据我所知，没有CSS技巧，唯一的方法是查询iFrame的document.documentElement.offsetHeight或scrollHeight，取决于哪个更高，取该值并将其应用于iframe的css高度（添加+'px'）。

Answer 3

尝试此ajax with cross domain功能

Answer 4

如果你正在使用jQuery，你可以使用load方法通过AJAX检索页面，可以选择从中抓取内容，并将其注入现有元素。唯一的问题是它需要JavaScript。

Answer 5

为什么不使用AJAX？

试试这个：

<div id="content"></div>

<script type="text/javascript">

function AJAXObj () {
    var obj = null;
    if (window.XMLHttpRequest) {
        obj = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        obj = new ActiveXObject("Microsoft.XMLHTTP");
    }
    return obj;
}

var retriever = new AJAXObj();

function getContent(url)
{
    if (retriever != null) {
        retriever.open('GET', url, true);
        retriever.onreadystatechange = function() {
            if (retriever.readyState == 4) {
                document.getElementsById('content').innerHTML(retriever.responseText);
            }
        }
        retriever.send(null);
    }
}

getContent('http://researchr.org/profile/eelcovisser/publications');

</script>

然后，您可以使用正则表达式解析收到的页面内容，从中提取您想要的任何内容。

编辑：对不起，我想我错过了这是一个不同的域名。但正如ceejayoz所说，你可以使用代理。

是否有轻量级的客户端HTML包含方法？

5 个答案: