jquery - 从另一个网站加载某些元素

Question

我正在为另一个网站（不在我的域上）创建视图成员屏幕。我正在尝试根据他们的课程从这个网站上检索某些东西。例如，我正在尝试获取具有 .avatar 类的人的头像。我试过了：

$('#accountPic').load('www.theWebsite.com .avatar');

尝试获取图像链接，但这不起作用。有什么方法可以从其他网站获取课程内容并自行显示？

Answer 1

由于Same Origin Policy ，这将无法通过客户端 javascript 工作。假设您尝试从中获取信息的站点没有用于外部访问的 API，解决方法是使用 PHP/ASP.Net 等获取 HTML 服务器端，然后通过 AJAX 请求。

Answer 2

第一步是检索外部站点的完整 HTML 文档。就其本身而言，这很可能会让您遇到无法解决的问题（由于浏览器安全限制）。

举例说明为什么这是一个安全问题：如果 somebank.com 的主页上有“欢迎回来，Jonathan T. Query！您当前的余额是 4000 美元。” 然后其他站点可以检索该文本，并将其发送给谁知道在哪里。

如果 thewebsite.com 有一个开发者 API 可以从中检索信息，您可以使用它。我知道在网站之间共享头像是 OpenID 项目的一个现实目标。如果没有，我认为您的问题可能无法解决。

Answer 3

如果目标主机提供跨域访问，你可以这样做：

$.ajax({ 
    url: 'http://www.theWebsite.com', 
    complete: function(jqXHR) { 
        var doc = $(jqXHR.responseText); 
        var avatar = doc.find('.avatar'); 
        // ...
    } 
});