在不请求图像的情况下将HTML字符串加载到jQuery中

Question

有没有办法在不请求图像的情况下将包含图像标记的HTML字符串加载到jQuery中？我希望能够在jQuery对象上运行选择器来提取一些信息.以下面的例子为例:

var string = $('<p><img src="http://image.url/file.jpg" /></p>');
string.find('img');

浏览器将发出http://image.url/file.jpg的请求.我正试图找到一种方法来做同样的事情,但没有浏览器请求图像.

谢谢

Answer 1

您可以使用XML文档执行搜索:

function searchXml(xmlStr, selector) {
    var parser, xmlDoc;
    if(window.DOMParser) {
        parser = new DOMParser();
        xmlDoc = parser.parseFromString(xmlStr, "text/xml");
    } else {
        xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
        xmlDoc.async = false;
        xmlDoc.loadXML(xmlStr); 
    }
    return $(xmlDoc).find(selector);
}

console.log(searchXml('<p><img src="http://image.url/file.jpg" /></p>', 'img').attr('src'));????

看到它在行动:http://jsfiddle.net/na9Tt/

请记住,它是一个XML文档,而不是HTML文档,因此某些特定于HTML的特定类型的搜索可能无法以完全相同的方式工作.

Answer 2

你需要清楚你的问题的界限。如果您的问题是：“有什么方法可以将精确的 HTML（不更改它）加载到 jQuery 对象（就像您正在做的那样）而不导致图像加载”，那么答案是否定的。jQuery 创建一个临时父对象并将您的 HTML 分配给innerHTML 属性，这会导致浏览器完全解析此 HTML，从而加载图像 URL。

因此，如果您想在此 HTML 上运行选择器操作而不加载图像，您有多种选择：

1. 在将 HTML 提供给 jQuery 之前修改图像标签，以便它们的.src属性消失或为空，或者<img>标签不是图像标签或不再存在。

2. 使用除此类 jQuery 之外的其他内容来解析 HTML，为选择器操作做好准备。

如果您详细说明了为什么要尝试执行此操作或尝试对选择器操作执行什么操作，我们也许可以建议更多替代方案。