Gunnar: FLASH DOM IE6.0 appendChild

Beitrag lesen

Hallo,

ich habe gerade angefangen mit JavaScript-Programmierung und habe leider ein hartnaeckiges Problem:

Ich moechte kleine Flash-Videos dynamisch auf meiner Webseite einbinden und dazu (W3C-konform) NICHT den Befehl innerHTML verwenden. Der Code, den ich dazu benutzen moechte ist auf das Wesentliche reduziert unten aufgelistet.

Mein Problem ist nun: Mit Firefox funktionieren beide Methoden (innerHTML und DOM) gleich gut, mit IE 6.0 bekomme ich mit der DOM-Methode keine Anzeige. Ich habe bereits ueber die Probleme von IE mit dem setAttribute-Befehl gelesen und diesen Befehl komplett entfernt; auch zeigen die (momentan wegkommentierten) Alert-Ausgaben, dass alle Attribute korrekt gesetzt sind.

  • Der Code : -------------------------------

<html>
<head><title>Test</title>
<script type="text/javascript">

function addFlashWithInnerHTML()
  {
    var tagObj = document.getElementById( "id01" );

tagObj.innerHTML = '<object type="application/x-shockwave-flash"' +
                       ' data="flashMovie.swf" style="width: 50px; height: 50px">' +
                       '    <param name="movie" value="flashMovie.swf"/>' +
                       '</object>';
  }

function addFlashWithDOM()
  {
    var tagObj = document.getElementById( "id01" );

var flashObj = document.createElement( "object" );
    flashObj.type = "application/x-shockwave-flash";
    flashObj.data = "flashMovie.swf";
    flashObj.style.width = "50px";
    flashObj.style.height = "50px";

var paramObj = document.createElement( "param" );
    paramObj.name = "movie";
    paramObj.value = "flashMovie.swf";

//Confirmation inserted values;
    /*
    alert( flashObj.getAttribute( "type" ) );
    alert( flashObj.getAttribute( "data" ) );
    alert( flashObj.style.getAttribute( "width" ) );
    alert( flashObj.style.getAttribute( "height" ) );
    alert( paramObj.getAttribute( "name" ) );
    alert( paramObj.getAttribute( "value" ) );
    */

var childB = tagObj.appendChild( flashObj );
    var childA = flashObj.appendChild( paramObj );

//Confirmation appended children values;
    /*
    alert( childA.getAttribute( "tagName" ) );
    alert( childA.getAttribute( "name" ) );
    alert( childA.getAttribute( "value" ) );
    alert( childB.getAttribute( "tagName" ) );
    alert( childB.getAttribute( "type" ) );
    alert( childB.getAttribute( "data" ) );
    alert( childB.style.getAttribute( "width" ) );
    alert( childB.style.getAttribute( "height" ) );
    */
  }

</script>

</head>
<body>

Click <em><a onclick="addFlashWithInnerHTML();"> here </a></em> for flash inclusion via innerHTML <br/><br/>
  Click <em><a onclick="addFlashWithDOM();"> here </a></em> for flash inclusion via DOM <br/><br/>
  Play flash object here:
  <span id="id01"></span>

</body>
</html>

--------------------------------------------

Auch auf die Gefahr hin, das diese Frage schon haeufig gestellt wurde (obwohl ich bislang durch googeln keine Antwort gefunden habe): Wie schaffe ich es, diesen Code standardkonform bleibt und TROTZDEM funktioniert?

Vielen Dank an jeden der mir weiterhelfen kann,

Gunnar