时间戳

首页 > 解决方案 > 为什么 `innerHTML` 属性属于 JavaScript `Element` 类而不是 `HTMLElement`？

javascript - 为什么 `innerHTML` 属性属于 JavaScript `Element` 类而不是 `HTMLElement`？

问题描述

我正在研究用 JavaScript 实现的文档对象模型，并且我理解（根据 MDN）Element类/原型旨在表示任意文档的元素，例如 HTML、XML 甚至 SVG 文档。相反，HTMLElement子类旨在表示特定 HTML 文档的元素。然而，这似乎并没有完全被两个类之间的实际所有权所证实。

特别是，为什么innerHTML看起来特定于 HTML 文档的 property 归Element原型所有？

Object.getOwnPropertyNames(Element.prototype).includes('innerHTML')
>>> true
Object.getOwnPropertyNames(HTMLElement.prototype).includes('innerHTML')
>>> false

同样，我观察到bodyandhead属性由 拥有Document.prototype，而不是HTMLDocument.prototype。这似乎很奇怪，因为我不希望所有类型的文档都有头部和主体。

这只是 JS 兼容性/遗留的怪异之处吗？（如果是这样，我想知道它是如何产生的）或者我所缺少的这种财产所有权结构是否有一些逻辑？

标签： javascripthtmldomprototype

解决方案

因为innerHTML，它不是在 HTML5 之前达到规范的，它是一种 IE 发明，后来在规范流行之前被其他供应商采用。
关于重命名甚至将其限制为HTMLElement界面的积极讨论。（例如，请参阅此HTML5 草案中的注释，或有关相关 DOM 问题的此评论
。） 但是为 MathML 甚至 SVG 元素保留它仍然是有意义的，因此他们保留了供应商设计的它。

对于 Document 案例......这是一个更大的混乱。
似乎从 DOM 1 开始，该body属性就没有打开，Document而是HTMLDocument仅打开，head根本不存在。
在 DOM 3 中，HTMLDocument接口不再是 DOM 规范的一部分，并且仍然不在DOM LS中。它现在由 HTML指定，但它只是Document接口的别名。
它也在HTML 规范中body被head定义为Document接口的扩展。

这是在尝试将所有[XXX]Document界面合并到Document. 我想最新的讨论在这里。对于一些历史，您可以查看这个错误和这个错误以及那里链接的所有内容。

事实上，现在似乎每个现代浏览器都确实保留HTMLDocument了 的别名Document，没有添加任何属性：

const own_props = Object.getOwnPropertyDescriptors( HTMLDocument.prototype );
console.log( Object.keys( own_props ) ); // [ "constructor" ] => doesn't add anything to Document

ps：（注意DOM通常不是用javascript实现的）。

推荐阅读