Why can't javascriptjQuery get parentNode? - Stack Overflow

admin管理员组

文章数量:1289548

Considering that I have an element like this:

<p class="ELP">2/1/2013 - <a id="EL3" class="ELLink" href="/Event htms/Event.cshtml?title=Okmulgee Public Schools County Professional Day&amp;explanation=Okmulgee Public Schools County Professional Day.&amp;dateString=2-1-2013">City Public Schools County Professional Day</a></p>

Why does this JavaScript/jQuery work...:

$(".ELP").click(function (){
        var stringDate = $(this).text().substring(0, 8)
        console.log(stringDate)
    });

Console.log produces: 2/1/2013

...And this JavaScript/jQuery doesn't?

$(".ELLink").click(function (){
        var stringDate = $(this).parentNode.text().substring(0, 8)
        console.log(stringDate)
    });

Console.log produces nothing because of JavaScript error: Uncaught TypeError: Cannot call method 'text' of undefined

Clearly I can see that it is not 'getting' the right element, but why? Isn't the first parent node of my 'a' element the 'p' element? As far as I understand it, there is no (at least no cross-browser/platform patible) valid css selector for the direct parent node of an element or i would just use that.

What am I not seeing?

Considering that I have an element like this:

<p class="ELP">2/1/2013 - <a id="EL3" class="ELLink" href="/Event htms/Event.cshtml?title=Okmulgee Public Schools County Professional Day&amp;explanation=Okmulgee Public Schools County Professional Day.&amp;dateString=2-1-2013">City Public Schools County Professional Day</a></p>

Why does this JavaScript/jQuery work...:

$(".ELP").click(function (){
        var stringDate = $(this).text().substring(0, 8)
        console.log(stringDate)
    });

Console.log produces: 2/1/2013

...And this JavaScript/jQuery doesn't?

$(".ELLink").click(function (){
        var stringDate = $(this).parentNode.text().substring(0, 8)
        console.log(stringDate)
    });

Console.log produces nothing because of JavaScript error: Uncaught TypeError: Cannot call method 'text' of undefined

Clearly I can see that it is not 'getting' the right element, but why? Isn't the first parent node of my 'a' element the 'p' element? As far as I understand it, there is no (at least no cross-browser/platform patible) valid css selector for the direct parent node of an element or i would just use that.

What am I not seeing?

• javascript
• jquery
• html
• click

Share Improve this question Follow asked Feb 1, 2013 at 16:37 VoidKingVoidKing 6,43299 gold badges5151 silver badges8383 bronze badges 3

• 3 jQuery objects don't have a parentNode property. try using the .parent() method instead. – Kevin B Commented Feb 1, 2013 at 16:38
• 1 use parent() instead of parentNode – N.B. Commented Feb 1, 2013 at 16:39
• Thanks for the help, guys, every search I did on this referred JavaScript parentNode property. Didn't really see the way jQuery implements this, but I get it now, thanks to all of you. But you would think I would have gotten some information on the parent() method. Again, thanks! – VoidKing Commented Feb 1, 2013 at 16:51

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 7

The jQuery method is called parent()

$(".ELLink").click(function (){
        var stringDate = $(this).parent().text().substring(0, 8)
        console.log(stringDate)
    });

Because the jQuery object does not have a parentNode property.

var stringDate = $(this.parentNode).text().substring(0, 8);

$(...) does not return DOM elements, it returns an array-like object that references DOM nodes. DOM nodes have parentNode. jQuery instances do not.

If you need to select the immediate parents of the selected elements, you can use parent():

$(this).parent().text()...

Why not use:

var stringDate = $(this).parent().text().substring(0, 8)

Since you're already using jQuery, you can use the parent function.

You need to use parent() not parentNode. Like this:

$(".ELLink").click(function (){
    var stringDate = $(this).parent().text().substring(0, 8)
    console.log(stringDate)
});

本文标签： Why can39t javascriptjQuery get parentNodeStack Overflow