Toon posts:

JS/DOM: appendChild werkt, maar toch niet, ofzo

Pagina: 1
Acties:

Verwijderd

Topicstarter
Met het idee mijn HTML schoon te houden heb ik mij begeven in het domein der DOM manipulatie. Als een user een bepaalde cookie heeft, wordt de volgende code uitgevoerd, om een extra 'Admin' link in het navigatie menu te creëren.
JavaScript:
1
2
3
4
5
6
7
8
navigation_list = document.getElementById('navigation_list');
li = document.createElement('li');
a = document.createElement('a');
a.setAttribute('href', '/admin/');
a_label = document.createTextNode('Administration')
a.appendChild(a_label);
li.appendChild(a);
navigation_list.appendChild(li);
Naar de voorbeelden die ik gevonden had gebruikte ik eerst createAttribute, maar dit gaf foutmeldingen. Toen kwam ik setAttribute tegen, gebruikte die en toen werkte het in Mozilla wel, maar met de foutmelding "Error: navigation_list has no properties". Beide versies van de code doen niks dan foutmeldingen geven in MSIE.

Er bestaat geen dubbele id of name in het document, en Tidy heeft niks te klagen. Ik vind het vooral raar dat de code dus 100% zeker wel het gewenste resultaat geeft in Mozilla/FF :?, op de error na dan :P. Wat is er fout aan deze code?

EDIT: Sorry mensen, geen al te simpele namen gebruiken was de oplossing. Het werkt nu. Code:
JavaScript:
1
2
3
4
5
6
7
8
navlist = document.getElementById('navigation_list');
navlist_item = document.createElement('li');
navlist_item_link = document.createElement('a');
navlist_item_link.setAttribute('href', '/admin/');
navlist_item_link_text = document.createTextNode('Administration')
navlist_item_link.appendChild(navlist_item_link_text);
navlist_item.appendChild(navlist_item_link);
navlist.appendChild(navlist_item);


Dom! (Als in Nederlands woord :P)

[ Voor 24% gewijzigd door Verwijderd op 20-06-2005 22:05 ]


  • André
  • Registratie: Maart 2002
  • Laatst online: 06-05 11:13

André

Analytics dude

Kan het zijn dat je document nog aan het laden is wanneer deze code wordt uitgevoerd? Want dan zou het zou kunnen zijn dat het element met het id navigation_list nog niet bestaat :)

Verwijderd

Topicstarter
Bedankt voor je reactie. Probleem al opgelost. Leuk hé, tegelijk posten!
ps. Geniaal bewerkt, de foto van die baby :P

[ Voor 31% gewijzigd door Verwijderd op 20-06-2005 22:08 . Reden: Hehe ]


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 00:23

crisp

Devver

Pixelated

Officieel zou het geen problemen mogen opleveren, maar dan heb je altijd nog Internet Explorer met backwards compatibility voor het al jaren overbodige document.all model. Hierdoor zijn elementen met een ID ook via de global namespace aan te spreken - en te overschrijven - in IE (ik had je niet voor niets gewezen op het declareren van variabelen binnen functie-scope om problemen in de global namespace te vermijden ;) )

Intentionally left blank


Verwijderd

Topicstarter
crisp schreef op maandag 20 juni 2005 @ 22:15:
ik had je niet voor niets gewezen op het declareren van variabelen binnen functie-scope om problemen in de global namespace te vermijden ;)
Ik weet het, ik weet het. Ik leer altijd van mijn fouten op de harde manier :P. Hier de herziene code:
JavaScript:
1
2
3
4
5
6
7
8
9
10
11
12
function doAdminThings() {
    if (getcookie('logged_in') == 'true') {
        var navlist = document.getElementById('navigation_list');
        var navlist_item = document.createElement('li');
        var navlist_item_link = document.createElement('a');
        navlist_item_link.setAttribute('href', '/admin/');
        var navlist_item_link_text = document.createTextNode('Administration')
        navlist_item_link.appendChild(navlist_item_link_text);
        navlist_item.appendChild(navlist_item_link);
        navlist.appendChild(navlist_item);
    }
}
Bedankt voor jullie suggesties!

  • r0bert
  • Registratie: September 2001
  • Laatst online: 26-04 17:38
:X [rml][ Alg] Naamgeving[/rml]
kun je het helemaal netjes :P
Pagina: 1