Den Text eines <span>-Elementes ändern?
kevinwiedener
- javascript
Hi Leute,
wie kann ich den Text eine <span>-Tags ändern.
Also konkret:
Der Quellcode:
<span name="zuaendern">Dieser Text soll geaendert werden</span>
Und jetzt soll mir eine Javascript-Funktion den Text "Text wurde geaendert" anstelle von "Dieser Text soll geaendert werden" ausgeben! Dies soll bei Buttonklick geschehen.
Das Programm soll Netscape- und MSIE-kompatibel sein, also kann ich dieses Problem nicht mittels all-Tags lösen!
Kann mir jemand helfen?
Danke
Kevin
Hallo,
wie kann ich den Text eine <span>-Tags ändern.
Also konkret:
Der Quellcode:
<span name="zuaendern">Dieser Text soll geaendert werden</span>
Und jetzt soll mir eine Javascript-Funktion den Text "Text wurde geaendert" anstelle von "Dieser Text soll geaendert werden" ausgeben! Dies soll bei Buttonklick geschehen.
<span id="dyntext">Dieser Text soll geaendert werden</span>
in der Scriptfunktion:
document.getElementById("dyntext").firstChild.nodeValue="Text wurde geaendert";
Das Programm soll Netscape- und MSIE-kompatibel sein, also kann ich dieses Problem nicht mittels all-Tags lösen!
Das funktioniert mit (halbwegs) DOM-Browsern, also nicht im Netscape < 6. Was sind "all-Tags"?
MfG, Thomas
<span id="dyntext">Dieser Text soll geaendert werden</span>
in der Scriptfunktion:
document.getElementById("dyntext").firstChild.nodeValue="Text wurde geaendert";
Das Programm soll Netscape- und MSIE-kompatibel sein, also kann ich dieses Problem nicht mittels all-Tags lösen!
Das funktioniert mit (halbwegs) DOM-Browsern, also nicht im Netscape < 6. Was sind "all-Tags"?
MfG, Thomas
Sorry, aber bei mir funktioniert das nicht, Thomas :-)
Kommt die Fehlermeldung, dass das Objekt diese Methode/Eigenschaft nicht unterstützt.
Gibts keine andere Möglichkeit, oder vielleicht sogar ne Möglichkeit die auch Netscape < 6 - kompatibel ist?
Kevin
Hallo,
Sorry, aber bei mir funktioniert das nicht, Thomas :-)
Kommt die Fehlermeldung, dass das Objekt diese Methode/Eigenschaft nicht unterstützt.
Naja, korrekt einbinden musst Du das schon ...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Test by TM 11/02</title>
<script language="JavaScript" type="text/javascript">
<!--
function DynText()
{
document.getElementById("dyntext").firstChild.nodeValue="Text wurde geaendert";
}
//-->
</script>
</head>
<body>
<span id="dyntext">Dieser Text soll geaendert werden</span>
<form action="">
<input type="button" value="Klick mich!" onclick="DynText()">
</form>
</body>
</html>
Gibts keine andere Möglichkeit, oder vielleicht sogar ne Möglichkeit die auch Netscape < 6 - kompatibel ist?
Es gibt noch innerHTML, was aber auch bei NN 4.x ausfaellt oder fuer NN 4.x Konstrukte mit layer-Objekten und document.write() [suche im Archiv].
MfG, Thomas
Hi
Kommt die Fehlermeldung, dass das Objekt diese Methode/Eigenschaft nicht unterstützt.
Dann ist dein Browser nicht (vollständig) DOM-fähig. [*g*]
Gibts keine andere Möglichkeit, oder vielleicht sogar ne Möglichkeit die auch Netscape < 6 - kompatibel ist?
<span id="text" onMouseOver="document.getElementById('text').innerHTML = 'Neuer Text'; ">Text</span>
Netscape 4 und IE 4 können das nicht, Opera 5 afaik auch nicht.
Fabian
Hallo,
<span id="text" onMouseOver="document.getElementById('text').innerHTML = 'Neuer Text'; ">Text</span>
bloss der Mozilla 1.1 packts offenbar nicht richtig, er verträgt wohl
den Verweis aufs gleiche Objekt nicht, ist ja auch etwas anspruchsvoller
als backgroundColor zu ändern.
Man merkt es an der Verzögerung, und onmousout schafft er dann nicht.
(Mozilla 1.1 Windows)
Der I.E.6 hingegen kommt sehr damit gut klar, da kann man auch den
mouseout umsetzen a la "Text" (bzw. alter Text), Respekt!
Grüsse
Cyx23
Hi
<span id="text" onMouseOver="document.getElementById('text').innerHTML = 'Neuer Text'; ">Text</span>
bloss der Mozilla 1.1 packts offenbar nicht richtig, er verträgt wohl
den Verweis aufs gleiche Objekt nicht, ist ja auch etwas anspruchsvoller
als backgroundColor zu ändern.
Man merkt es an der Verzögerung, und onmousout schafft er dann nicht.
(Mozilla 1.1 Windows)
Habe exakt dieselbe Version, funktioniert problemlos... *kopfkratz*
Der I.E.6 hingegen kommt sehr damit gut klar, da kann man auch den
mouseout umsetzen a la "Text" (bzw. alter Text), Respekt!
Naja, das kann er afaik nur, weil er da intern document.all.id.value nimmt >;)
Fabian
Hallo,
<span id="text" onMouseOver="document.getElementById('text').innerHTML = 'Neuer Text'; ">Text</span>
bloss der Mozilla 1.1 packts offenbar nicht richtig, er verträgt wohl
den Verweis aufs gleiche Objekt nicht, ist ja auch etwas anspruchsvoller
als backgroundColor zu ändern.
Man merkt es an der Verzögerung, und onmousout schafft er dann nicht.
(Mozilla 1.1 Windows)
Habe exakt dieselbe Version, funktioniert problemlos... *kopfkratz*
so schaut der Code aus:
<div id="movers"><span id="motxt"
onMouseOver="document.getElementById('motxt').innerHTML = 'Neuer Text'; "
onMouseout="document.getElementById('motxt').innerHTML = 'Alter Text'; ">Alter Text</span>
</div>
und beim -Over gibt es 0.5-1 sec. Verzögerung, das -out wird nicht
umgesetzt, ist doch kein Schreibfehler oder so, zumal IE6 es macht?
Der I.E.6 hingegen kommt sehr damit gut klar, da kann man auch den
mouseout umsetzen a la "Text" (bzw. alter Text), Respekt!
Naja, das kann er afaik nur, weil er da intern document.all.id.value nimmt >;)
Also er hat doch das gleiche Problem, mouseover oder out
gewissermaßen rekursiv, bzw. können u.U. nicht beendet werden wenn
das Object zwischendrinnen nicht vorhanden bleibt?
In der JavaScriptkonsole ist nichts bemängelt
Grüsse
Cyx23
Hi
(Mozilla 1.1 Windows)
Habe exakt dieselbe Version, funktioniert problemlos... *kopfkratz*so schaut der Code aus:
<div id="movers"><span id="motxt"
onMouseOver="document.getElementById('motxt').innerHTML = 'Neuer Text'; "
onMouseout="document.getElementById('motxt').innerHTML = 'Alter Text'; ">Alter Text</span>
</div>und beim -Over gibt es 0.5-1 sec. Verzögerung, das -out wird nicht
umgesetzt, ist doch kein Schreibfehler oder so, zumal IE6 es macht?
aber doch!
onMouseout="document.getElementById('motxt').innerHTML = 'Alter
^^^^
Da JS CaseSensitive ist, kommt hier ein onMouse_O_ut ganz gut ;-)
Also er hat doch das gleiche Problem, mouseover oder out
gewissermaßen rekursiv, bzw. können u.U. nicht beendet werden wenn
das Object zwischendrinnen nicht vorhanden bleibt?
In der JavaScriptkonsole ist nichts bemängelt
Seltsam, bei mir treten keinerlei Fehler auf, er macht alles zügig nacheinander...
Fabian
Hallo,
onMouseout="document.getElementById('motxt').innerHTML = 'Alter
^^^^
also O statt o hatte ich auch schon, macht keinen Unterschied.
Seltsam, bei mir treten keinerlei Fehler auf, er macht alles zügig nacheinander...
Ich hab jetzt nur folgendes als *.html gespeichert:
<div id="movers"><span id="motxt"
onMouseOver="document.getElementById('motxt').innerHTML = 'Neuer Text';"
onMouseOut="document.getElementById('motxt').innerHTML = 'Alter Text';">Alter Text</span>
</div>
und da ist der gleiche Effekt mit Mozilla 1.1, es liegt also
offenbar nicht an der übrigen Seite.
Hast du vielleicht eine neuere Version als die 1.1?
Grüsse
Cyx23
Hi Fabian,
Da JS CaseSensitive ist, kommt hier ein onMouse_O_ut ganz gut ;-)
hm... beherrscht Mozilla denn kein XHTML?
http://www.w3.org/TR/xhtml1/#h-4.2
LG Ro*SCNR*land