I'm new to javascript and simply trying to pull links from a webpage so I'm doing the following:
for(link in document.links) {
console.log(link.getAttribute("href");
}
But if I do this:
document.links.item(0).getAttribute("href")
It returns the link for the first href
What am I doing wrong?
Here is the webpage I'm testing against: http://en.wikipedia.org/wiki/JavaScript_syntax
Just get the elements by tag name and avoid the for in loop.
var links = document.getElementsByTagName('a'),
i;
for(i = 0; i < links.length; i += 1){
console.log(links[i].getAttribute("href"));
}
For your example, you would have used:
for(link in document.links) {
console.log(document.links[link].getAttribute("href"));
}
While that technically works, it returns prototype properties in addition to the link elements. This will throw errors since .getAttribute("href") won't work for all the return elements.
You could use the hasOwnProperty() method and check.. but still, i'd avoid the for in loop.
for (link in document.links) {
if (document.links.hasOwnProperty(link)) {
console.log(document.links[link]);
}
}
document.links.item
is an array of items.
document.links.item(0) gets the first item in that array.
document.links.item(1) gets the second item in that array.
To answer your question, what you are doing wrong is that you are not looping the links.item array as you did in your first example.
In your code, you are accessing item 0 and only getting the href from that. For that reason, you will only get one link.
What you probably want to do is get the href for all of the of the links at once
var hrefs = [], i
for (i=0;i<document.links.length;++i) {
hrefs.push(document.links.item(i).getAttribute('href'))
}
Then your hrefs array will contains all the urls
