Entfernen von HTML-Element-Stilen über Javascript

Question

Ich versuche, einen Inline-Stil-Tag-Wert eines Elements zu ersetzen. Das aktuelle Element sieht wie folgt aus:

`<tr class="row-even" style="background: red none repeat scroll 0% 0%; position: relative; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;" id="0000ph2009-06-10s1s02">` 

und ich möchte all diesen Stil Zeug entfernen, so dass es von seiner Klasse gestylt ist, anstatt es Inline-Stil ist. Ich habe versucht, element.style zu löschen; und element.style = null; und element.style = ""; umsonst. Mein aktueller Code bricht bei dieser Aussage ab. Die gesamte Funktion wie folgt aussieht:
Funktion unSetHighlight (index) {

if(index < 10) 
index = "000" + (index); 
else if (index < 100) 
    index = "000" + (index); 
    else if(index < 1000) 
    index = "0" + (index); 
    if(index >= 1000) 
     index = index; 

var mainElm = document.getElementById('active_playlist'); 
var elmIndex = ""; 

for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){ 
    if(currElm.nodeType === 1){ 

    var elementId = currElm.getAttribute("id"); 

    if(elementId.match(/\b\d{4}/)){ 

    elmIndex = elementId.substr(0,4); 


    if(elmIndex == index){ 
     var that = currElm; 
     //that.style.background = position: relative; 
     } 
    } 
    } 
} 

clearInterval(highlight); 
alert("cleared Interval"); 
that.style.background = null; 

alert("unSet highlight called"); 
} 

die clearInterval funktioniert, aber der Alarm nie ausgelöst und der Hintergrund bleibt gleich. Wer sieht irgendwelche Probleme? Vielen Dank im Voraus ...

---

function unSetHighlight(index){ 
    alert(index); 
    if(index < 10) 
    index = "000" + (index); 
    else if (index < 100) 
     index = "000" + (index); 
     else if(index < 1000) 
     index = "0" + (index); 
     if(index >= 1000) 
      index = index; 

    var mainElm = document.getElementById('active_playlist'); 
    var elmIndex = ""; 

    for(var currElm = mainElm.firstChild; currElm !== null; currElm = currElm.nextSibling){ 
     if(currElm.nodeType === 1){ 

     var elementId = currElm.getAttribute("id"); 

     if(elementId.match(/\b\d{4}/)){ 

     elmIndex = elementId.substr(0,4); 
     alert("elmIndex = " + elmIndex + "index = " + index); 


     if(elmIndex === index){ 
      var that = currElm; 
      alert("match found"); 
      } 
     } 
     } 
    } 

    clearInterval(highlight); 
    alert("cleared Interval"); 
    that.removeAttribute("style"); 

    //that.style.position = "relative"; 
    //reColor(); 
    alert("unSet highlight called"); 
} 

Answer 1

Sie können einfach tun: element.removeAttribute("style")

Answer 2

getElementById("id").removeAttribute("style"); 

wenn Sie jQuery dann

$("#id").removeClass("classname"); 

Answer 3

Das Klassenattribut verwenden, können mehrere Arten enthalten, So können Sie es als

angeben

<tr class="row-even highlight"> 

und String-Manipulation tun entfernen 'Highlight' von element.className

element.className=element.className.replace('hightlight',''); 

---

jQuery verwenden würde diese einfacher machen, wie Sie die Methoden haben

$("#id").addClass("highlight"); 
$("#id").removeClass("hightlight"); 

, die Sie ermöglichen würde, um leicht zu markieren

Answer 4

In JavaScript:

document.getElementById("id").style.display = null; 

In jQuery:

$("#id").css('display',null); 

Answer 5

Verwenden

particular_node.classList.remove("<name-of-class>")

für native Javascript