AlexW: Workaround für IE-Bug?

Hallo.

Ich habe hier einen seltsamen Bug, der mit dem IE auftritt aber nicht mit dem Firefox:

<html>
<body>
<span id="main">
<input type="text" id="source" name="source">
</span>
</body>
<script language="JavaScript">
var source=document.getElementById("source")
var clone=source.cloneNode(true);
clone.id="clone";
clone.name="clone";

	document.getElementById("main").insertBefore(clone,source);  
	alert(document.getElementById("source").id);  
</script>  

</html>

Dieses Beispiel sollte eigentlich "source" ausgeben, es gibt aber beim IE "clone" aus. Wenn ich "name" im input weglasse, funktioniert es.
Leider habe ich dort wo ich diese Funktionalität brauche keinen Einfluss auf das name-Attribut. Kann ich den Bug trotzdem irgendwie umgehen, so dass ein getElementById das richtige Element zurückgibt?

Vielen Dank im Voraus,

Alex.

  1. [latex]Mae  govannen![/latex]

      var source=document.getElementById("source")  
      var clone=source.cloneNode(true);  
    

    Ungetestete Vermutung: Versuch es mal mit anderen Variablen-Namen.

    Cü,

    Kai

    --
    „It's 106 miles to Chicago, we got a full tank of gas, half a pack of cigarettes,
    it's dark, and we're wearing sunglasses“.  „Hit it!“
    Foren-Stylesheet Site Selfzeugs
    SelfCode: sh:( fo:| ch:? rl:( br:< n4:( ie:{ mo:| va:) js:| de:> zu:) fl:( ss:| ls:?
    1. [latex]Mae  govannen![/latex]

        var source=document.getElementById("source")  
        var clone=source.cloneNode(true);  
      

      Ungetestete Vermutung: Versuch es mal mit anderen Variablen-Namen.

      Im richtigen Code wo ich es brauche, werden ganz andere Namen verwendet. Das hier ist nur ein kleines Beispiel, um es zu reproduzieren.

      Alex.

    2. n'abend,

      Ungetestete Vermutung: Versuch es mal mit anderen Variablen-Namen.

      Automatische-ID-Objekt-Population des Internet Explorers

      weiterhin schönen abend...

      --
      #selfhtml hat ein Forum?
      sh:( fo:# ch:# rl:| br:> n4:& ie:{ mo:} va:) de:] zu:} fl:( ss:? ls:[ js:|
    3.   var source=document.getElementById("source")  
      

      Ungetestete Vermutung: Versuch es mal mit anderen Variablen-Namen.

      Wenn ich das richtig im Kopf habe, ist es kein Problem, dass der IE hier bereits eine globale Variablen namens source kennt. Man kann sie nämlich mit einer gleichnamigen lokalen Funktionsvariable problemlos »überschreiben«. var window = "nicht das globale Objekt"; geht genauso.

      Mathias

      1. Hi,

          var source=document.getElementById("source")  
        

        Ungetestete Vermutung: Versuch es mal mit anderen Variablen-Namen.

        Wenn ich das richtig im Kopf habe, ist es kein Problem, dass der IE hier bereits eine globale Variablen namens source kennt.

        Korrekt - wenn es dieser Fehler gewesen wäre, dann würde das Script an dieser Stelle abbrechen, zum klonen und einhängen des neuen Knotens wäre es dann gar nicht mehr gekommen.

        MfG ChrisB

        --
        Light travels faster than sound - that's why most people appear bright until you hear them speak.
  2. Hi,

      var source=document.getElementById("source")  
      var clone=source.cloneNode(true);  
      clone.id="clone";  
      clone.name="clone";  
    
      document.getElementById("main").insertBefore(clone,source);  
      alert(document.getElementById("source").id);  
    

    Dieses Beispiel sollte eigentlich "source" ausgeben, es gibt aber beim IE "clone" aus. Wenn ich "name" im input weglasse, funktioniert es.

    Der IE hat Probleme damit, das name-Attribut korrekt zu setzen bei Elementen, die bereits erzeugt sind.
    document.createElement("input") und anschliessendes setzen des name-Attributes hat das gleiche Problem - dabei kann man im IE auf die Alternativ-Syntax document.createElement('<input name="..." ...>') ausweichen.

    Wenn du dir mal das innerHTML von body ausgeben lässt, siehst du es:
    <INPUT id=clone name=source><INPUT id=source name=source>

    Dass der IE dir bei document.getElementById("source").id "clone" ausgibt liegt daran, dass er auch getElementById defekt implementiert hat - er liefert das erste Element im Dokument mit passender ID *oder* passendem Namen zurück - und das ist hier dein Klon, dessen name immer noch "source" lautet, weil der IE sich das nach der Erstellung zu ändern weigerte.

    Leider habe ich dort wo ich diese Funktionalität brauche keinen Einfluss auf das name-Attribut. Kann ich den Bug trotzdem irgendwie umgehen, so dass ein getElementById das richtige Element zurückgibt?

    Musst du "Klonen" - reicht ein eigenhändiges Neu-Erstellen des Elementes nicht? Dabei könntest du die erwähnte Alternativ-Syntax nutzen.

    Ansonsten kannst du auch nach dem Einhängen des Klons ins Dokument (vorher hat in meinem Test nicht die gewünschte Wirkung) ihm sein eigenes outerHTML noch mal zuweisen, mit geändertem name:
    clone.outerHTML = clone.outerHTML.replace(/name=source/, "name=clone");

    Da solltest du aber etwas ausführlicher testen, ob dir das nichts anderes kaputt macht - wie ggf. Eventhandler, die ans Element gebunden wurden, o.ä.

    Btw., ich habe das ganze mittels IETester im IE 7 getestet; im darin enthaltenen 8er war dein Beispiel schon gar nicht erst lauffähig - was natürlich am IETester selber liegen kann. Aber wenn du es im 8er noch nicht getestet hast, solltest du das auch noch machen.

    MfG ChrisB

    --
    Light travels faster than sound - that's why most people appear bright until you hear them speak.
    1. Ansonsten kannst du auch nach dem Einhängen des Klons ins Dokument (vorher hat in meinem Test nicht die gewünschte Wirkung) ihm sein eigenes outerHTML noch mal zuweisen, mit geändertem name:
      clone.outerHTML = clone.outerHTML.replace(/name=source/, "name=clone");

      Das hat funktioniert.

      Vielen, vielen Dank! :-)

      Alex.