解析& lt; img>SRC属性在<script>和/或& lt; noscript>标签

Parse <img> src attribute found within <script> and/or <noscript> tags

本文关键字：lt 标签 script noscript 属性 img SRC 解析      更新时间：2023-09-26

我有以下字符串:

<script src="https://sys.com/lerers/adkljrver?c=28dsfsd1&w=323434230&h=5424523420&ord=[timestamp]&z=0"></script>
<noscript>
<a href="https://ving-sys.com/server/asfdsfsdr.bs?cn=brd&pli=107dsfsd486sdfds231&Page=&Pos=1979577902" target="_blank">
<img src="https://bs.faf-sys.com/Serving/adServer.bs?c=8534&cn=displaying&pli=1073924861&Page=&Pos=77902" border=0 width=320 height=50></a>
</noscript>

我的目标是解析出src, width和height属性，而不使用正则表达式或任何类型的indexOf()/loop/If逻辑。

此解析将在浏览器中进行，因此可以使用本机浏览器功能或jQuery。

我已经试过了:

//myString is equal to the string above
var $jQueryObject = $('<div>' + myString + '</div>');
console.log($jQueryObject.find('img').attr('src'))

返回undefined。我认为这与尝试解析noscript和脚本标记中的元素有关。任何帮助返回src，高度和宽度元素将不胜感激。

使用DOMParser将是最简单的方法-请参阅所提供的链接中的浏览器兼容性表，具体来说，这不适用于IE9或更早版本

var parser = new DOMParser(),
    ns = document.querySelector('noscript'),
    doc = parser.parseFromString(ns.textContent, 'text/html'),
    img = doc.querySelector('img');
console.log(img.width);
console.log(img.height);
console.log(img.src);

注意:你可以这样做来打动女孩:

var img = (new DOMParser()).parseFromString(document.querySelector('noscript').textContent, 'text/html').querySelector('img');
console.log(img.width);
console.log(img.height);
console.log(img.src);

在IE8/IE9的情况下，如果你必须支持它们，你可以这样做

var div = document.createElement('div');
div.innerHTML = document.querySelector('noscript').textContent;
var img = div.querySelector('img');
console.log(img.width);
console.log(img.height);
console.log(img.src);

但是请注意，图像将使用以下代码获取

相关文章：