I've searched quite a bit on both google and stackoverflow, but a lack of knowledge on how to ask the question (or even if I'm asking the right question at all) is making it hard to find pertinent information.
I have a simple block of code that I am experimenting with to teach myself javascript.
var studio = document.getElementById('studio');
var contact = document.getElementById('contact');
var nav = document.getElementById('nav');
var navLinks = nav.getElementsByTagName('a');
var title = navLinks.getAttribute('title');
I want to grab the title attribute from the links in the element with the ID 'nav'.
Whenever I look at the debugger, it tells me that Object #<NodeList> has no method 'getAttribute'
I have no idea where I'm going wrong.
The nodetype and nodevalue for navLinks es back as undefined, which I believe may be part of the problem, but I'm so new to this that I honestly have no idea.
I've searched quite a bit on both google and stackoverflow, but a lack of knowledge on how to ask the question (or even if I'm asking the right question at all) is making it hard to find pertinent information.
I have a simple block of code that I am experimenting with to teach myself javascript.
var studio = document.getElementById('studio');
var contact = document.getElementById('contact');
var nav = document.getElementById('nav');
var navLinks = nav.getElementsByTagName('a');
var title = navLinks.getAttribute('title');
I want to grab the title attribute from the links in the element with the ID 'nav'.
Whenever I look at the debugger, it tells me that Object #<NodeList> has no method 'getAttribute'
I have no idea where I'm going wrong.
The nodetype and nodevalue for navLinks es back as undefined, which I believe may be part of the problem, but I'm so new to this that I honestly have no idea.
Share Improve this question edited Jul 17, 2011 at 21:26 Michael Berkowski 271k47 gold badges450 silver badges394 bronze badges asked Jul 17, 2011 at 21:23 SquadronsSquadrons 2,5776 gold badges25 silver badges38 bronze badges 1-
Don't use getAttribute for standard HTML attributes, use the related DOM property, so
var title = navLinks[0].title
. It's faster, less to type and removes the browser differences in getAttribute. – RobG Commented Jul 18, 2011 at 2:04
3 Answers
Reset to default 4The getElementsByTagName
method returns an array of objects. So you need to loop through this array in order to get individual elements and their attributes:
var navLinks = nav.getElementsByTagName('a');
for (var i = 0; i < navLinks.length; i++) {
var link = navLinks[i];
var title = link.title;
}
Calling nav.getElementsByTagName('a')
returns list of objects. And that list doesn't have getAttribute() method. You must call it on ONE object.
When you do:
navLinks[0].getAttribute('title')
then it should work - you will get title of the first matched element.
var navLinks = nav.getElementsByTagName('a');
getElementsByTagName
returns multiple elements (hence Elements
), because there can be multiple elements on one page with the same tag name. A NodeList
(which is a collection of nodes as returned by getElementsByTagName
) does not have a getAttribute
method.
You need to access the property of the element that you actually need. My guess is that this will be the first element you find.
var title = navLinks[0].getAttribute('title');