Toon posts:

[JS] this parameter levert geen dom properties

Pagina: 1
Acties:

Verwijderd

Topicstarter
Als ik aan een <a>-element de onclick-attribuut toevoeg met daarin een functieaanroep die this als parameter meegeeft:
HTML:
1
<p id="para"><a href="#" onclick=test(this);">...</a></p>


dan kan ik in die functie wel properties uitlezen van het <a>-element m.b.v. de meegegeven parameter this:
JavaScript:
1
2
3
function test(element) {
    alert(element.href);
}

maar kan ik niet omringende elementen 'bereiken' m.b.v. DOM-properties zoals nextSibling of parent:
JavaScript:
1
2
3
4
function test(element) {
    var parentElement = element.parent;
    alert(parentElement.id);
}

Dit levert de foutmelding: "nextElement has no properties". Voor de zekerheid heb ik de constructor van element gecontroleerd, dat is een HTMLAnchorElement, dat is een afgeleide van het Node-object en dat zou dus properties zoals nextSibling of parent moeten ondersteunen.

Dit werkt wel:
HTML:
1
<p id="para"><a href="#" onclick=test('para');">...</a></p>

JavaScript:
1
2
3
4
function test(parentId) {
    var parentElement = document.getElementById(parentId);
    alert(parentElement.id);
}

maar dat vind ik minder elegant, het lijkt mij handig om als je toch binnen de context van een element bent, andere element via DOM-properties te bereiken.

Doe ik iets verkeerd?

Verwijderd

parentNode

  • Clay
  • Registratie: Oktober 1999
  • Laatst online: 25-02 11:17

Clay

cookie erbij?

"nextElement has no properties".
nextSibling, zoals je zelf al zegt ook, wel gebruiken dan ;)

Instagram | Flickr | "Let my music become battle cries" - Frédéric Chopin


Verwijderd

die heeft ook geen properties, want die <a> is het enige child

Verwijderd

Topicstarter
Bedankt voor de snelle hulp. parentNode was echt stom, zo'n fout die je over het hoofd blijft zien. Maar nextSibling geeft niet het gewenste resultaat. Even ter verduidelijking, ik had de code niet gekopieerd, maar ff snel geschreven. In mijn bestand heb ik:

JavaScript:
1
2
3
4
5
function test(element) {
var nextElement = element.nextSibling;
var parentElement = element.parentNode;
alert(parentElement.id + "," + nextElement.href);
}


HTML:
1
2
3
4
<p id="para">
<a id="link1" href="#" onClick="test(this);">...</a>
<a id="link2" href="#">...</a>
</p>


Ik krijg als resultaat voor de href property van het volgende element undefined terug.

Verwijderd

komt denk ik omdat er een whitespacenode tussen zit, je kan of de newlines uit je source halen of steeds de volgende nextSibling pakken tot je nodeType goed is

edit: nodeType==1 dus, als het een textNode is is ie 3

[ Voor 16% gewijzigd door Verwijderd op 09-08-2005 13:29 ]


Verwijderd

Topicstarter
Dat is 'em! _/-\o_ Onwijs bedankt, ik wist niet dat whitespace ook een node was...

Verwijderd

wel in een inline context
http://www.mozilla.org/docs/dom/technote/whitespace/

[ Voor 52% gewijzigd door Verwijderd op 09-08-2005 13:55 ]

Pagina: 1