nicht angemeldet
Undifferenzierte Behandlung des name- und id-Attributs
Am besten lernt man das Potential einer Skript-Sprache kennen, wenn man ab und zu mal versucht, mehrere Lösungen für ein Problem zu finden. Um einen kleinen anklickbaren Bildwechsel zu bewerkstelligen stehen unten 4 unterschiedliche Funktionen zur Verfügung, die alle dasselbe bewirken:
1. Eine einfache if-else Abfrage
2. Eine kleine Zählschleife mit einem Array
3. Eine kleine Zählschleife ohne Array
4. Eine Variante mit innerHTML.
Dabei hab' ich zwei Bilder mit gleichlautendem name- und id-Attribut eingebaut ( flipflop ) Dabei fällt auf, daß lediglich der MSIE hier eine meiner Meinung nach korrekte Differenzierung vornimmt und alle anderen Browser das name-Attribut wie ein id-Attribut behandeln und demzufolge auch das falsche Bild wechsel. ( also hier das zweite statt das dritte Bild )
Die betroffene Code-Zeile: document.images.flipflop.src
Frage: Was ist hierfür die Ursache? Wenn ich für das name-Attribut einen anderen Namen wähle, funktioniert alles einwandfrei!
Gruß Wastl
<html><head><title></title><script type="text/javascript">
var bild1 = new Image(); bild1.src = "bild1.png";
var bild2 = new Image(); bild2.src = "bild2.png";
var bild3 = new Image ();
var bilderalbum = new Array ("bild1.png","bild2.png");
var image = bild1;
var index = 0;
var zahl = 1;
function bildwechsel1 () {
if (image == bild1) {
image = bild2;
document.images[0].src = bild2.src;
}else {
image = bild1;
document.images[0].src = bild1.src;
}}
function bildwechsel2 ()
{
index++
document.getElementById ("flipflop").src = bilderalbum[index];
if (index == 1) {index = -1;}
}
function bildwechsel3 ()
{
zahl++
document.images.flipflop.src = "bild"+zahl+".png";
if (zahl == 2) {zahl = 0;}
}
function bildwechsel4 ()
{
zahl++
var wechsel = document.getElementById ("innerhtml");
wechsel.innerHTML = "<img src='bild"+zahl+".png' onclick='bildwechsel4 ()' alt=''>";
if (zahl == 2) {zahl = 0;}
}
</script></head><body>
<img src="bild1.png" onclick="bildwechsel1 ()" alt="" align="left">
<img id="flipflop" src="bild1.png" onclick="bildwechsel2 ()" alt="">
<img name="flipflop" src="bild1.png" onclick="bildwechsel3 ()" alt="" align="left">
<div id="innerhtml"><img src="bild1.png" onclick="bildwechsel4 ()" alt=""></div>
</body></html>
-
Hi,
Am besten lernt man das Potential einer Skript-Sprache kennen, wenn man ab und zu mal versucht, mehrere Lösungen für ein Problem zu finden.
eine sehr gute Einleitung.
Dabei hab' ich zwei Bilder mit gleichlautendem name- und id-Attribut eingebaut ( flipflop ) Dabei fällt auf, daß lediglich der MSIE hier eine meiner Meinung nach korrekte Differenzierung vornimmt
Deine Meinung lässt eine Tatsache außer Acht: Das id- und das name-Attribut nutzen für die meisten Elemente den selben Namespace. Werden in einem Element beide Attribute benutzt, müssen sie den selben Wert besitzen; die Gleichbehandlung von name und id ist durchaus legitim. Ausnahmen hiervon sind Elemente, in denen der Name eine spezielle Bedeutung hat: Formularelemente. Da der Name ein technischer Identifier ist, der außerhalb des Dokuments bzw. von HTML wirksam ist, kann (darf) die Regel hier keine Anwendung finden.
und alle anderen Browser das name-Attribut wie ein id-Attribut behandeln und demzufolge auch das falsche Bild wechsel. ( also hier das zweite statt das dritte Bild )
Eigentlich schade, dass keiner eine Fehlermeldung liefert.
<html><head><title></title><script type="text/javascript">
Wie verhält sich der IE, wenn Du ihn aus dem Quirksmode nimmst?
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi!
[...] Ausnahmen hiervon sind Elemente, in denen der Name eine spezielle Bedeutung hat: Formularelemente. Da der Name ein technischer Identifier ist, der außerhalb des Dokuments bzw. von HTML wirksam ist, kann (darf) die Regel hier keine Anwendung finden.
Hm. Gerade da ist beides bei mir gleich. (Das ist einer der seltenen Faelle wo ich ueberhaupt beides benutze) Das vereinfacht doch den Zugriff erheblich und man weiss immer gleich welches Feld gemeint ist.
-
Hi,
[...] Ausnahmen hiervon sind Elemente, in denen der Name eine spezielle Bedeutung hat: Formularelemente. Da der Name ein technischer Identifier ist, der außerhalb des Dokuments bzw. von HTML wirksam ist, kann (darf) die Regel hier keine Anwendung finden.
Hm. Gerade da ist beides bei mir gleich.nun, das ist Deine Entscheidung. Der Punkt ist, dass der Standard diese nicht treffen darf - er würde außerhalb seines Kompetenzbereiches Vorgaben treffen, die Fremdsysteme beeinflussen.
(Das ist einer der seltenen Faelle wo ich ueberhaupt beides benutze) Das vereinfacht doch den Zugriff erheblich und man weiss immer gleich welches Feld gemeint ist.
Bei mir ist das Schema üblicherweise folgendes:
<form id="formFoo">
<input name="bar" id="inpFooBar"/>
<input type="radio" name="qaz" value="baz" id="inpFooQazBaz"/>
</form>Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi!
Bei mir ist das Schema üblicherweise folgendes:
<form id="formFoo">
<input name="bar" id="inpFooBar"/>
<input type="radio" name="qaz" value="baz" id="inpFooQazBaz"/>
</form>Sowas aehnliches hab ich mir just auch ueberlegt, da ich gerade mit diversen Formularen auf einer Seite kaempfe, die oftmals gleichartige Inputfelder besitzen. (User Id, Passwort...) Da machts schon Sinn, wenn die User ID Felder in jedem Formular gleich heissen aber eine eindeutige ID besitzen.
-
-
-
-
Hi!
Dabei hab' ich zwei Bilder mit gleichlautendem name- und id-Attribut eingebaut ( flipflop ) Dabei fällt auf, daß lediglich der MSIE hier eine meiner Meinung nach korrekte Differenzierung vornimmt und alle anderen Browser das name-Attribut wie ein id-Attribut behandeln und demzufolge auch das falsche Bild wechsel. ( also hier das zweite statt das dritte Bild )
Die betroffene Code-Zeile: document.images.flipflop.src
Frage: Was ist hierfür die Ursache?Da du keinen Doctype angegeben hast, unterstelle ich mal HTML 4.01.
Die Spezifikation § 13.2 sagt dazu:"name = This attribute names the element so that it may be referred to from style sheets or scripts. Note. This attribute has been included for backwards compatibility. Applications should use the id attribute to identify elements."Wie Cheatah ja bereits geschrieben hat, ist die Gleichbehandlung von id und name also durchaus legitim. Der IE hinkt hier wieder eher mal hinterher.
Das "Konstrukt" birgt aber ja auch die Tücke, dass streng genommen (wenn id und name also gleichbehandelt werden), dann ja eigentlich die id nicht mehr dokumentweit einzig ist.
Vermutlich einer der Gründe, warum das name-Attribut für img in XHTML 1.0 Strict nicht mehr erlaubt ist (siehe: http://de.selfhtml.org/html/referenz/attribute.htm#img).
Fazit: Man sollte nur id verwenden, und alles wird gut! ;-)
Gruß Gunther