javascript - 寻找一种用 JS 抓取 HTML 的方法

Question

正如标题所示，我正在寻找一种从网页中抓取所有 HTML 的简单方法。也许将其存储在字符串中，然后浏览该字符串以提取所需的元素。

具体来说，我想抓取我的 Twitter 页面并在新的 div 中显示我的个人资料图片。我知道有几种工具可以做到这一点，但我想知道有人可以提供一些代码示例或建议来指导我如何自己做到这一点吗？

非常感谢

更新

在 T.J. 做出了非常有帮助的回应之后克劳德我在网上做了更多搜索，发现了这个resource .

Answer 1

理论上，这很容易。您只需执行 ajax 调用来获取页面的文本，然后使用 jQuery 将其转换为断开连接的 DOM，然后使用所有常用的 jQuery 工具来查找和提取您需要的内容。

$.ajax({
    url:     "http://example.com/some/path",
    success: function(html) {
        var tree = $(html);
        var imgsrc = tree.find("img.some-class").attr("src");
        if (imgsrc) {
            // ...add the image to your page
        }
    }
});

但是(而且这是一个很大的问题)它不太可能起作用，因为 Same Origin Policy ，这可以防止跨域 ajax 调用。某些个别站点可能有一个开放的 CORS政策，但大多数不会，当然也支持 IE8 和 IE9 上的 CORS requires an extra jQuery plug-in .

因此，要对不允许您的来源通过 CORS 的网站执行此操作，必须涉及服务器。它可以是您的服​​务器，您可以使用服务器端代码获取您想要的页面文本，然后通过 ajax 将其发送到您的页面(或者当您首先渲染它)。所有常见的服务器端堆栈(PHP、Node、ASP.Net、JVM...)都具有抓取网页的能力。或者，在某些情况下，您可以使用 YQL as a cross-domain proxy ，使用他们的服务器而不是您自己的。