我需要获取网页中元素的实际 html 代码。
例如，如果元素内的实际 html 代码是 "How to fix"
运行这个 JavaScript：
getElementById('myE').innerHTML
给我"How to fix"哪个是解析的 HTML。
如何"How to fix"使用 JavaScript获取未解析的内容？
使用 JavaScript 获取未解析的（原始）HTML
IT技术
javascript
html
2021-01-31 03:29:12
3个回答
您无法获得部分网页的实际HTML 源代码。
当您向 Web 浏览器提供 HTML 页面时，它会将 HTML 解析为一些 DOM 节点，这些节点是浏览器所关注的文档的最终版本。DOM 保留了来自 HTML 的重要信息——就像你在单词前使用了 Unicode 字符 U+00A0 Non-Breaking Space——fix但不会保留你通过实体引用而不是直接输入原始信息使用它的无关信息（ ）。
当您向浏览器询问元素节点的 时innerHTML，它不会为您提供经过解析以生成该节点的原始 HTML 源代码，因为它不再具有该信息。相反，它从存储在 DOM 中的数据生成新的 HTML。浏览器决定如何格式化 HTML 序列化；不同的浏览器会生成不同的 HTML，而且很可能与您最初对其进行格式化的方式不同。
特别是，
元素名称可以大写或小写；
属性的顺序可能与您在 HTML 中声明的顺序不同；
属性引用可能与您的来源不同。IE 经常生成不带引号的属性，这些属性甚至不是有效的 HTML；您可以确定的是，
innerHTML通过将生成的内容写入另一个元素的innerHTML;可以安全地在同一浏览器中使用。除了无法直接包含在文本内容中的字符外，它可能不会使用实体引用：&、小于和属性值引用。而不是返回
它可能只是给你原始
您可能无法看到这是一个不间断的空间，但它仍然是一个，如果您将该 HTML 插入另一个元素，它将作为一个元素。您不需要依赖实体转义的不间断空格字符到任何地方 ......如果您这样做，出于某种原因，您可以通过执行以下操作来实现：
x= el.innerHTML.replace(/\xA0/g, ' ')
但这只是转义 U+00A0 而不是其他数千个可能的 Unicode 字符中的任何一个，所以这有点值得怀疑。
如果您真的需要获取页面的实际 HTML 源代码，您可以创建XMLHttpRequest您自己的 URL ( location.href) 并在responseText. 几乎从来没有一个很好的理由这样做。
你有什么应该工作：
元素测试：
<div id="myE">How to fix</div>
JavaScript 测试：
alert(document.getElementById("myE").innerHTML); //alerts "How to fix"
你可以在这里试一试。确保无论您在哪里使用结果都不会显示 为空格，这很可能是这种情况。如果你想在专为 HTML 设计的地方展示它，你需要转义它。
您可以改用脚本标记，它不会解析 HTML。当有尖括号时，这更相关，例如加载 lodash 或下划线模板。
document.getElementById("asDiv").value = document.getElementById("myDiv").innerHTML;
document.getElementById("asScript").value = document.getElementById("myScript").innerHTML;<div id="myDiv">
<h1>
<%= ${var} %> %>
How to fix
</h1>
</div>
<script id="myScript" type="text/template">
<h1>
<%= ${var} %>
How to fix
</h1>
</script>
<textarea rows="10" cols="40" id="asDiv"></textarea>
<textarea rows="10" cols="40" id="asScript"></textarea>因为解析了 div 中的 HTML，括号的内部 HTML 返回为
<
，但作为脚本则不然。