title: Can I create an abstract document listened by the CSS engine?
body: <p>It is possibile to create an abstract copy of my document tree that is also listened by the CSS engine?</p>
  
  <p>What do I mean by "listened by CSS engine?" Simply, when I add an id, class, or attribute, to an element of this abstract document, the CSS selector must change the property values of the element like in the real DOM, and I must be able to access those values by using the <code>getComputedStyle</code> method</p>
  
  <p>ex. [CSS]</p>
  
  <pre class="lang-css prettyprint-override"><code>a {
      color: red;
  }
  
  .bar {
      color: blue;
  }
  </code></pre>
  
  <p>ex. [DOM]</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;a href="#"&gt;Lorem&lt;/html&gt;
  </code></pre>
  
  <p>ex. [JavaScript]</p>
  
  <pre class="lang-js prettyprint-override"><code>var copiedDocument = document.copy();
  var abstractLink = copiedDocument.getElementsByTagName('a')[0];
  
  /* RETURN =&gt; red */
  getComputedStyle(abstractLink).getPropertyValue("color");
  
  abstractLink.setAttribute("class", "bar");
  
  /* MUST RETURN =&gt; blue */
  getComputedStyle(abstractLink).getPropertyValue("color");
  </code></pre>