DOM in IE7

Status
Niet open voor verdere reacties.

jorikke

Gebruiker
Lid geworden
13 jul 2011
Berichten
27
Hallo,

ik heb een probleem met het presenteren van een JSONrequest op een website. Door middel van een alert in mijn Javascript weet ik dat de juiste informatie wordt ontvangen, maar de presentatie gaat niet juist. Ik vermoed dat IE7 anders om gaat met het aanmaken van objecten dan andere versies en browsers, want in IE8 en IE9 gaat het prima.

Hier een stuk code:

Code:
var div1 = document.createElement("div");
div1.setAttribute("class", "searchresultdiv");
div1.setAttribute("onclick", "openId("+resultaten.id+", 'results');");
document.getElementById("hometabinhoud").appendChild(div1);

var div2 = document.createElement("div");
div2.setAttribute("class", "searchresultfotodiv");
div1.appendChild(div2);

var foto = document.createElement("img");
if(resultaten.afbeelding){
foto.setAttribute("src", "foto/"+resultaten.afbeelding);
}
else{
foto.setAttribute("src", "afb/noimage.png");
}
div2.appendChild(foto);

De attributen zoals de foto en verderop in de code ook geboortedatum, naam, enz. worden wel weergeven, maar de parent-div (hierboven div1 met de classname searchresultdiv) wordt niet aangemaakt, of wordt in ieder geval niet getoond aangezien vanuit de klassenaam in de css ook de stijlementen van de foto wordt aangegeven, en deze worden dus niet ingeladen. Er worden overigens ook geen javascript-errors of warnings gegeven.

Helaas bevat IE ook geen goede debugger waardoor ik überhaupt niet kan kijken welke elementen er aanwezig zijn (enkel vanuit de beginsituatie van de pagina, maar deze wordt aangepast door de DOM).

Wie kan mij helpen?
 
Hoi jorikke,
Ja, IE7 reageert niet op setAttribute("class", "..."), wel op setAttribute("className", "...").
Maar daar kan de rest weer niets mee!

Gelukkig is er een alternatief via de rechtstreekse DOM-benadering, zodat er geen Conditional Comments nodig zijn voor IE7:
[JS]...
div1.className="searchresultdiv";
...
div2.className="searchresultfotodiv";
...[/JS]

Voor het bekijken van de gegenereerde broncode van IE kan je verder de "Web Accessibility Toolbar For IE" gebruiken:
  • www.paciellogroup.com/resources/wat-ie-about.html
  • Onder de knop "Source" zit o.a. de optie "View Generated Source".
  • Ook handig om in IE even snel javascript uit/aan te zetten.
  • Deze WAT is ook voor andere dingen nuttig: ik gebruik 'm als aanvulling op Firebug en de Webdeveloper Toolbar voor Firefox.

Maar via de "Internet Explorer Developer Toolbar" van Microsoft (ingebouwd in IE8, los te downloaden voor voor IE7) kan je ook de DOM-stamboom afreizen, en zien wat het javascript ervan gemaakt heeft (met bijbehorende css-styles).

Met vriendelijke groet,
CSShunter
__________
*) Firefox, Chrome, Opera, Safari en de hele rits IE's: IE7, IE8, IE9 en IE10-ConsumerPreview. En ook IE5.5 en IE6! :cool:
 
Laatst bewerkt:
Super! bedankt voor de uitgebreide uitleg! Altijd weer dat IE7 dat het op een andere manier wil he..
 
Status
Niet open voor verdere reacties.

Nieuwste berichten

Terug
Bovenaan Onderaan