noscript.innerHTML在浏览器中的结果不同

Question

以下代码在safari，chrome和firefox中的结果不同。

var noscript = document.getElementsByTagName('noscript')[0];
console.log(noscript.innerHTML);

Chrome的结果：

<img alt="***" title="***" src="***" width="***" height="***" srcset="***" sizes="***"  />

Firefox的结果：

<img alt=\"***\" title=\"***\" src=\"***\" width=\"***\" height=\"***\" srcset=\"***\" sizes=\"***\"  />

Safari的结果：

<img alt="***" title="***" src="***" sizes="***"  />

如何跨浏览器创建和注入有效的img元素？

以下在Chrome和Firefox中有效

noscript.insertAdjacentHTML('beforebegin',noscript.innerHTML);

Safari的后续工作

var html = new DOMParser().parseFromString(noscript.innerHTML, "text/html");
noscript.insertAdjacentHTML('beforebegin',html.documentElement.innerText);

Answer 1

您可以使用多种客户端检测和兼容性检测技术来检测浏览器，然后针对每种情况执行正确的代码。https://stackoverflow.com/a/9851769/10905239