Připojit styl k DOM nenahrazuje existující

Jak mohu připojit prvek stylu na DOM bez odstranění existujícího stylu na položce (např. barva, zarovnání textu atd.)?

Událost volá funkci, ale problém je, že „Style“ je místo toho zcela nahrazeno jedinou položkou.

Mám jednoduchý kód spuštěný na události:

function changeback(onoff) {
   if(onoff) {
      document.getElementById("field1").style.background="#fff";
   } else            
      document.getElementById("field1").style.background="#000";
}

Odpověď

Který prohlížeč používáte? V Chrome mi funguje toto:

<html> 
<head> 
<style type="text/css"> 
  .test { background: #ff0000; font-family: "Verdana"; }
</style> 
<script type="text/javascript"> 
  function changeback(onoff)
  {
    if(onoff){
      document.getElementById("field1").style.background="#0f0";
    } else {
      document.getElementById("field1").style.background="#000";
    }
  }
 </script> 
 </head> 
 <body> 
   <h1>Test</h1> 
   <p id="field1" onclick="changeback(true);" class="test">This is a test</p> 
</body> 
</html> 

Když kliknu na text, změní se barva pozadí, ale zbytek stylu (v tomto případě písmo) zůstane stejný.

Snažíte se o to?