Question

为什么我可以将JavaScript符号绑定到HTMLElement的style属性以外的所有内容？

这是HTML：

<div id='a'></div>

这是Javascript：

const a = document.querySelector('#a');
a.classList._someSymbol = Symbol('some_symbol');
console.log(1);
a.style._someSymbol = Symbol('some_symbol');
console.log(2);

这是输出：

1
     （索引）：35未捕获的TypeError：无法将Symbol值转换为字符串
     在window.onload（（索引）：35）

更新：

整个故事是我正在编写一个代理，它将把Symbol附加到每个属性中，作为get陷阱中的标识符，这无意中包含了样式。最终，我将仅包含我感兴趣的属性，而不会包含样式。但是现在我得到了这个错误，我很好奇为什么会这样。

Answer 1

?试试这个：

const a = document.querySelector('#a');

a.classList._someSymbol = {};
a.classList._someSymbol = Symbol('some_symbol');
console.log(1);

a.style._someSymbol = {};
a.style._someSymbol = Symbol('some_symbol');
console.log(2);

我不知道为什么它会以这种方式工作。

Answer 2

取决于浏览器。由于HTML是一种标准（这是有关用户代理应如何解释文档的一系列准则）。

因此，您的上述示例在FireFox中有效，但在Google Chrome中不起作用。如果您想了解原因，建议您浏览一下浏览器的源代码，该源代码似乎正在转换符号toString

无法将Javascript符号绑定到HTMLElement.style

2 个答案: