jQuery .load 请求不需要的图像答案

【问题标题】：jQuery .load requesting unwanted imagesjQuery .load 请求不需要的图像
【发布时间】：2015-08-08 02:46:33
【问题描述】：

我有 2 个网站。站点 A 的主页包含一个新闻部分，我使用 jQuery 的 .load 函数将此内容加载到站点 B 页面上的 div 中，使用以下代码：

$('.siteBnews').load('http://www.sitea.co.uk .news');

这一切都很好。问题是，在内容被拉入后，源页面上的每一个图像都会被请求，而这些图像都不在 .news 部分中。浏览器控制台充满了 404 错误，因为请求的 URL 格式为 http://siteb.sitea.co.uk/image.jpg。

我看不出它为什么会尝试抓取所有这些图像，尽管这不会影响页面本身，但我宁愿不发生 404 错误的负载。任何人都可以帮忙吗？谢谢。

【问题讨论】：

尝试在 iframe 中展示它
我尝试打开给定的链接，但它返回以下错误：ERR_NAME_NOT_RESOLVED
我会想象 jQuery 获取 html 并从中创建一个 DOM 元素在内存中，以便它可以解析元素以找到匹配“.news”的元素。如果不指定选择器，它还会这样做吗？
@Robert_Junior 我只想显示页面的一小部分，所以我不能使用 iframe。
@RadonirinaMaminiaina 这不是真正的链接，只是格式的示例。

标签： javascript jquery http-status-code-404

【解决方案1】：

我想.load 无法做到这一点，因为在成功回调中它将 responseText 添加到节点：

self.html( selector ?

    // If a selector was specified, locate the right elements in a dummy div
    // Exclude scripts to avoid IE 'Permission Denied' errors
    jQuery("<div>").append( jQuery.parseHTML( responseText ) ).find( selector ) :

    // Otherwise use the full result
    responseText );

在内存中创建 DOM 元素。例如，如果您清除网络选项卡并在控制台中执行：

$('<img src="https://www.google.co.uk/images/srpr/logo11w.png"/>')

您将在网络选项卡中看到正在加载的图像，因为即使图像被插入到 DOM 中，浏览器也会加载图像（这就是图像预加载器的工作方式和原因）。您可能必须使用$.ajax 或$.get（这是负载在后台使用的）并手动解析返回的HTML 字符串，并且只将您想要的元素包装到一个jQuery 对象中。通过 html 解析可能会很痛苦，这就是为什么 jQuery 改为通过 DOM 元素来执行此操作。

例如$.get({ url: 'http://www.sitea.co.uk', dataType: 'html'}).done(..parse data string..)

【讨论】：