采用以下(简单的)HTML 页面:
<html>
<head>
<script src="jquery-1.12.3.min.js"></script>
</head>
<body>
<div id='test'>
<img src='/path/to/image?width=1024&height=768' />
</div>
</body>
</html>
如果我在浏览器控制台中输入如下内容:
$("#test").html()
我得到:
<img src="/path/to/image?width=1024&height=768">
为什么有 &在 img源属性已变为 & ？
如果 & 符号出现在段落文本(或类似的东西)中，我能理解……但为什么图像源会那样触摸？这将打破页面以进行进一步处理...
有没有办法从 <div/> 中获取“原始”HTML ？
最佳答案
Why has the
&in img source attribute has been turned to&?
因为它应该是1 &首先;浏览器在解析 HTML 时为您修复了它，因为浏览器是宽容的。 :-)
HTML 属性中的文本是HTML 文本。在 HTML 文本中，<和 &必须编码，因为它们都有特殊值:<是标签的开头，&是字符实体的开始。对它们进行编码的典型方法是使用命名字符实体:<和 & ( > 也经常写成 > ，但在标签外没有必要)。如果你有 &浏览器的解析器确定不开始一个字符实体，解析器备份并像它看到 & 一样工作反而。 HTML5 规范在 §8.2.4.2 中解决了这个问题: &将解析器置于“数据状态”并且解析器尝试使用字符引用；它退回到将其作为文字处理 &如果它无法使用字符引用。
所以浏览器修复了它，然后 jQuery 检索了更正后的版本，这就是记录到控制台的内容。
This is going to break the page for further processing...
任何正确处理 HTML 文本的东西都不会受此影响，任何只处理该属性值而不处理定义它的值的 HTML 文本的东西也不会受到影响。
例如，如果你问 img元素是什么 src是的，你会得到一个只有 & 的字符串其中:
var img = document.querySelector("#test img");
console.log(img.getAttribute("src"));
console.log(img.src);<div id='test'>
<img src='/path/to/image?width=1024&height=768' />
</div>那是因为 src和 getAttribute返回字符串，而不是我们在 HTML 中编写字符串的方式。
类似地，任何使用属性匹配选择器的东西都可以正常工作。
// src*="&height" means "an element with a src attribute
// containing &height anywhere in the value
var img = document.querySelector('img[src*="&height"]');
console.log("Found it? " + (img ? "true" : "false"));<div id='test'>
<img src='/path/to/image?width=1024&height=768' />
</div> &仅用于在 HTML 中定义该属性的 HTML 文本。如果一个工具正在处理 HTML 文本，它需要正确理解 HTML 文本。
1 “应该” 在这里可以说是一个强词，因为 HTML 规范 clearly defines那一个&不会启动字符实体，也不是 ambiguous ampersand应该读作 & . (这将是一个模棱两可的符号:&asldkfj; 因为它开始的东西看起来像一个字符实体，但不是一个)。所以从这个意义上说，原文只是写同样东西的另一种方式，依赖于 & 的事实。没有歧义。
关于javascript - html() 中的 jQuery 编码，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37830591/