Archief - JS: Menu-fout via DOM

Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.

`SeriOUs

Legacy Member
http://www.pepop.be/test/menu.htm

Ik ben een navigatie-script aan het proberen te schrijven dat volledig onafhankelijk van de html werkt. Dus geen onmouseovers/outs in de html-file zelf. (http://www.pepop.be/test/menu.htm)

Nu zit ik vast met een kl*te probleem:
In de function menu(), bij de onmouseover zegt de browser dat navLi.item(i) geen properties heeft.
Ik heb totaal geen idee hoe dit komt.
Ik wil dus bereiken dat als je over de <li> tag komt, de onderliggende <ul> tag zichtbaar wordt.

PLEASE HELP. :(

DarkBone

Legacy Member
Hmm... de code ziet er perfect logisch uit.
Mij lijkt het een vrij bizar scoping probleem (omwille van die functiedefinitie die je toekent aan het onmouseover event wschl... buiten die functie kan ie er perfect aan namelijk) hoewel het perfect logisch lijkt, en de scope volgens mij geen problemen zou mogen geven.

Heb zelf al wat zitten uitproberen, maar voorlopig zonder resultaat.

`SeriOUs

Legacy Member
Het vreemde is dat het zelfs verder gaat als de scoping van variabelen.
Als je alles voluit schrijft, dus:

alert(document.getElementById("nav").childNodes.item(i).nodeName); geeft hij dezelfde "no-properties"-fout... quite deranged :confused:

Slicer

Legacy Member
Het probleem zit hem inderdaad in het fout dat navLi niet meer gedefinieerd is als de functie wordt opgeroepen (en ook i niet). Wat je nodig hebt is het id van het te openen/sluiten blok.

Om jouw code te doen werken volstaat: navLi.item(i).onmouseover= new function ("alert('" + navLi.item(i).nodeName + "');"); te gebruiken.

Voor je uiteindelijke script zal je dus de childNodes van het li element moeten doorlopen naar die van de sub-ul en er dan het id van opvragen (node.id).

Verder wou ik even opmerken dat in xhtml (verzonden als application/xhtml-xml) de nodeNames in kleine letters staan, een nodeName.toLowerCase () maakt dat dit algemeen zal werken.

PS: waarom benader je een array met array.item (id) ipv array[id]?

`SeriOUs

Legacy Member
whohow, direct een uittesten. :)

En alles naar een lowercase zetten, heeft dat voordelen? Enkel de externe javascript moet dit toch verwerken?

Ik gebruik .item() omdat ik dit op het moment wat overzichtelijker vind werken. Maar zal dit wrschijnlijk nog vervangen.

Slicer

Legacy Member
Kom omwille van de conventies van xml, alle tags moeten daar in lower case staan en daar xhtml normaal een xml applicatie is moeten de tags ervan ook in lower case staan. Standaard (html 4 enzo) staan de tags (intern) in upper case.

Het werkt dus zolang je de html als text/html verstuurd maar als je het als echte xhtml content wil versturen zal het niet werken (want het is dan li ipv LI). Een toUpperCase of toLowerCase zorgt dat het in beide gevallen werkt.

`SeriOUs

Legacy Member
Dat xhtml lowercases gebruikt wist ik, maar de nodeNames die door de DOM worden geparcest en doorgegeven staan wel in uppercase.
Dus dat naar lowercase zetten is enkel handig als je dingen gaat toevoegen via xml/dom op je webpage...

of ben ik verkeerd?

anyhow, muchos tanxos m8 :)

DarkBone

Legacy Member
`SeriOUs zei:
Dat xhtml lowercases gebruikt wist ik, maar de nodeNames die door de DOM worden geparcest en doorgegeven staan wel in uppercase.
Dus dat naar lowercase zetten is enkel handig als je dingen gaat toevoegen via xml/dom op je webpage...

Nog eens opnieuw lezen wat Slicer zei:

Het werkt dus zolang je de html als text/html verstuurd maar als je het als echte xhtml content wil versturen zal het niet werken (want het is dan li ipv LI). Een toUpperCase of toLowerCase zorgt dat het in beide gevallen werkt.

Echte xhtml content: application/xhtml+xml ... alleen wordt dit nog zelden gebruikt omdat Internet Explorer hier niet mee overweg kan.

Kort: de reden waarom je ze terugkrijgt in hoofdletters is omdat je het document aan de browser voorschotelt als zijnde van het MIME-type text/html.

`SeriOUs

Legacy Member
Aaaah, nu snap ik het volledig zie.
Merci allemaal!

Zal me deze vakantie toch serieus mogen verdiepen in die zakes. :sop:
Het archief is een bevroren moment uit een vorige versie van dit forum, met andere regels en andere bazen. Deze posts weerspiegelen op geen enkele manier onze huidige ideeën, waarden of wereldbeelden en zijn op sommige plaatsen gecensureerd wegens ontoelaatbaar. Veel zijn in een andere tijdsgeest gemaakt, al dan niet ironisch - zoals in het ironische subforum Off-Topic - en zouden op dit moment niet meer gepost (mogen) worden. Toch bieden we dit archief nog graag aan als informatiedatabank en naslagwerk. Lees er hier meer over of start een gesprek met anderen.
Terug
Bovenaan