[JavaScript] Attribute ändern unter IE - setAttribute()
andré
- javascript
0 Thomas Meinike0 Cyx23
hi,
schaut euch bitte mal folgenden Code (am besten Copy&Paste) an:
zum online ausprobieren: http://mytabs.wmw.cc/test.htm
[CODE]
<html><head><title>TestJS</title>
<style type="text/css">
.item1 {
background-color: #CCCCCC;
}
.item2 {
background-color: #EEEEEE;
}
</style>
</head>
<body id="body">
<p id="p"><a href="javascript:add();">add</a><br>
<a href="javascript:changeColor();">changeColor (von item1)</a></p>
<div id="main">
<div id="item0" class="item1">item0</div>
<div id="item1" class="item1">item1</div>
<div id="item2" class="item1">item2</div>
</div>
<script type="text/javascript">
var zaehler = 3;
var classSwitch = "item1";
function add() {
var newDiv = document.createElement("div");
var newDivText = document.createTextNode("item" + zaehler);
zaehler++;
newDiv.appendChild(newDivText);
newDiv.setAttribute("id", "item" + zaehler);
newDiv.setAttribute("class", classSwitch);
if (classSwitch == "item1") { classSwitch = "item2"; }
else { classSwitch = "item1"; }
document.getElementById('main').appendChild(newDiv);
}
function changeColor() {
document.getElementById('item1').setAttribute("class", classSwitch);
document.getElementById("body").setAttribute("bgColor", "#EDEFF8");
if (classSwitch == "item1") {
classSwitch = "item2";
} else {
classSwitch = "item1";
}
}
</script>
</body></html>
[/CODE]
Klick auf add fügt neues Element hinzu. changeColor ändert die Hintergrundfarbe von item1.
Unter Mozilla funtioniert die ganze Sache wie gewünscht. Aber NICHT mit dem IE (6.0).
Der Versuch das Attribut "bgColor" zuändern funtioniert. Der Versuch das Attribut "class" zu ändern scheitert.
Außerdem scheitert das ändern von Attributen wie "id" oder "style". Attribute wie "align" funktionieren dagegen.
Kann mir jemand sagen woran das liegt? Gibt es einen anderen Weg Attribute zu ändern?
Ich bin für jeden Rat dankbar!
Hallo,
Der Versuch das Attribut "class" zu ändern scheitert.
Verwende className:
document.getElementById("...").className="...";
Außerdem scheitert das ändern von Attributen wie "id" oder "style". Attribute wie "align" funktionieren dagegen.
Das Erzeugen von IDs sollte auch im IE 5.5/6.0 mit object.setAttribute("id","..."); funktionieren (evtl. mal als dritten Parameter true setzen). Probiere es alternativ mit object.id="...";
MfG, Thomas
Hallo,
Kann mir jemand sagen woran das liegt? Gibt es einen anderen Weg Attribute zu ändern?
offenbar setzt der IE das Attribut (per outerHTML erkennbar), kann es dann aber nicht umsetzen bzw. erkennt letztendlich die Bedeutung des gesetzten Attributs im Gegensatz zur id nicht.
Mit document.createAttribute("class"), nodeValue und setAttributeNode klappt es zumindest beim IE 6 auch ordentlich, sonst geht noch etwas rustikaler mit document.getElementById("item" + zaehler).className=...
Grüsse
Cyx23