Javascript innerHTML和&；nbsp；

我有一个奇怪的JavaScript行为，我无法解释

考虑以下代码：

var el = document.createElement('div')
var s = String.fromCharCode(160)

el.innerHTML = s

console.log(s)            // prints space
console.log(el.innerHTML) // prints " "

现在我知道,是不间断的空格，但从技术上讲，我只是将一个变量赋值给另一个变量，两者都是字符串。 为什么价值观不同

innerHTML

是一种特殊的字符串还是什么

---

它是如何工作的？翻译这一点的机制是什么

innerHTML

不是一个简单的属性，它是一个带有

getter

和

setter

的访问器属性。意味着引擎盖下的功能工作

innerHTML

将给定的输入序列化为HTML。它解析给定的值，创建元素和节点，然后将这些元素和节点附加到元素

它的定义是这样的

const-DOMElement={
值：null，
设置innerHTML（html）{
log（`settinghtml:${html}`）；
//转换为元素和节点，然后附加到元素
this.value=html；
},
获取innerHTML（）{
log（`Getting html:`）；
//翻译成字符串，然后返回它
返回此.value；
}
};
doElement.innerHTML='你好
'；
log（DOMElement.innerHTML）
从技术上讲，我只是把一个变量赋值给另一个，两者都是字符串。为什么价值观不同

因为是的，
innerHTML
是特殊的。它不仅仅是一个简单的值属性，它还是一个访问器属性。当您分配给它时，您正在调用一个隐藏的函数，该函数解析您提供给它的HTML并创建必要的DOM节点和元素。当您读取它的值时，您正在调用另一个函数，该函数在DOM树中递归，从您访问它的元素开始，并构建表示该DOM树的HTML字符串

因此，当您将字符U+00A0分配给它时，它变成了一个DOM文本节点；当您从中读取时，该DOM文本节点被呈现为一个规范（根据该浏览器的规则）HTML字符串：

通过使用DOM操作元素，您可以看到
innerHTML
不仅仅是一个简单的值属性：


var target=document.getElementById（“目标”）；
target.innerHTML=“\u00A0”；
console.log（target.innerHTML）；//" "
target.appendChild(
document.createElement（“span”）
);
console.log（target.innerHTML）；//“”
所以它是一个特殊的字符串，不是常规JavaSciprt对象的常规属性？是的，它不是常规属性。在后台，它将给定的值转换为HTML样式生成节点或elements@YossiVainshtein：这取决于“regular”的含义。它不是一个值属性，而是一个具有访问器的属性（在本例中，由DOM对象定义，但也可以使用JavaScript对象来定义）。@T.J.Crowder with getter和setter，不只是一个简单的属性。@SureSrapyan:我是这么说的：一个带有访问器的属性。谢谢，这很有意义，所以它不是一个简单的值属性，它是一个带有逻辑的sortof C风格属性？在这种情况下，
el.innerHTML.\uuuuu proto\uuuu
仍然说这是String@YossiVainshtein：是的，就像C#properties一样。不，这并不奇怪
el.innerHTML.\uuuu proto\uuuu
是
String
：-）您访问的是getter函数（它是一个字符串）的返回值，而不是getter函数本身。（就像
x=el.innerHTML；x.\uuu proto\uuuuu；
）。相反，您希望查看的结果，但由于它是DOM属性，因此浏览器不必对其支持该操作。（但如果您想查看JS对象的访问器…）