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