title: Actual hidden properties on HTML elements - what is the correct term?
body: <p>I've known about this for a while, but I'm not exactly sure what it's called:</p>
  <pre><code>var el = document.createElement(&quot;p&quot;);
  el.innerText = &quot;Hello&quot;;
  el.loremipsum = &quot;TEST STRING&quot;; &lt;-- THIS
  
  document.body.appendChild(el);
  </code></pre>
  <p>If I inspect the DOM, this is what I get:</p>
  <pre><code>&lt;p&gt;Hello&lt;/p&gt;
  </code></pre>
  <p>The <code>loremipsum</code> property is not in the DOM, but:</p>
  <pre><code>document.querySelector(&quot;p&quot;).loremipsum
  </code></pre>
  <p>returns &quot;TEST STRING&quot;. What is this property manipulation called? I would like to research it a bit. And yes, I know data attributes are better to use.</p>