jQuery解析HTML而不加载图像

我从其他页面加载HTML以从该页面中提取和显示数据：

$.get('http://example.org/205.html', function (html) { console.log( $(html).find('#c1034') ); }); 

这确实有效，但由于$(html)我的浏览器尝试加载205.html中链接的图像。 我的域上不存在这些图像，因此我收到了很多404错误。

有没有办法解析页面，如$(html)但没有将整个页面加载到我的浏览器？

Answer 1

实际上，如果你查看jQuery文档，它说你可以将“所有者文档”作为第二个参数传递给$ 。

那么我们可以做的是创建一个虚拟文档，以便浏览器不会自动加载提供的HTML中存在的图像：

 var ownerDocument = document.implementation.createHTMLDocument('virtual'); $(html, ownerDocument).find('.some-selector'); 

Answer 2

使用正则表达式并删除所有标记

  html = html.replace(/]*>/g,""); 

Answer 3

使用以下方法解析html将自动加载图像。

 var wrapper = document.createElement('div'), html = '.....'; wrapper.innerHTML = html; 

如果使用DomParser解析html，则不会自动加载图像。 有关详细信息，请参阅https://github.com/panzi/jQuery-Parse-HTML/blob/master/jquery.parsehtml.js 。

Answer 4

很抱歉复原旧问题，但这是第一个搜索如何尝试停止解析html加载外部资产的结果。

我接受了Nik Ahmad Zainalddin的回答，但是其中存在一个弱点，即标签之间的任何元素都被消灭了。

  Inert text  

在上面的示例中， Inert text将与脚本标记一起删除。 我最后做了以下事情：

 html = html.replace(/<\s*(script|iframe)[^>]*>(?:[^<]*<)*?\/\1>/g, "").replace(/(<(\b(img|style|head|link)\b)(([^>]*\/>)|([^\7]*(<\/\2[^>]*>)))|(<\bimg\b)[^>]*>|(\b(background|style)\b=\s*"[^"]*"))/g, ""); 

此外，我添加了删除iframe的function。

希望这有助于某人。

Answer 5

您可以使用jQuerys remove()方法来选择图像元素

 console.log( $(html).find('img').remove().end().find('#c1034') ); 

或者从HTML字符串中删除。 就像是

 console.log( $(html.replace(/]*>/g,"")) ); 

关于背景图片，您可以这样做：

 $(html).filter(function() { return $(this).css('background-image') !== ''; }).remove(); 

Answer 6

以下正则表达式替换了所有出现的, , ，包括ajax load返回的数据字符串中的background和style属性。

 html = html.replace(/(<(\b(img|style|script|head|link)\b)(([^>]*\/>)|([^\7]*(<\/\2[^>]*>)))|(<\bimg\b)[^>]*>|(\b(background|style)\b=\s*"[^"]*"))/g,""); 

测试正则表达式： https ： //regex101.com/r/nB1oP5/1

我希望有一个更好的解决方法（除了使用正则表达式替换）。

Answer 7

您可以使用以下正则表达式来删除所有src属性，而不是完全删除所有img元素：

 html = html.replace(/src="[^"]*"/ig, "");