title: Why is the `innerHTML` property owned by the JavaScript `Element` class rather than `HTMLElement`?
body: <p>I am studying the document object model implemented in JavaScript, and I understand (this according to MDN) that the <code>Element</code> class/prototype is meant to represent an element of an arbitrary document, e.g. HTML, XML, or even SVG documents. In contrast, the <code>HTMLElement</code> sub-class is meant to represent elements of specifically HTML documents. However, this does not seem to be totally borne out by the actual ownership of properties between the two classes.</p>
  <p>In particular, why is the property <code>innerHTML</code>, which seems to be specific to HTML documents, owned by the <code>Element</code> prototype?</p>
  <pre><code>Object.getOwnPropertyNames(Element.prototype).includes('innerHTML')
  &gt;&gt;&gt; true
  Object.getOwnPropertyNames(HTMLElement.prototype).includes('innerHTML')
  &gt;&gt;&gt; false
  </code></pre>
  <p>Similarly, I observe that the <code>body</code> and <code>head</code> properties are owned by <code>Document.prototype</code>, rather than <code>HTMLDocument.prototype</code>. This seems peculiar as I wouldn't expect all types of documents to have a head and body.</p>
  <p>Is this just JS compatibility/legacy weirdness? (If so, I wonder if there is a story of how it came about) Or is there some logic to this property-ownership structure that I am missing?</p>