View Full Version : get the href value

06-08-2007, 05:30 PM

I am trying to implement something like this but no lack in my code:

var deadlinks=document.getElementsByTagName("a");
for (var i=0;i<deadlinks.length;i++){
if(deadlinks[i].href == '#') {
deadlinks[i].onclick = openModal;

What i'm trying to achieve is get all dead links with an href="#" value and assign to them a function.

06-08-2007, 05:56 PM
That should work, but a another way of assigning functions to anchors is using javascript:void(statement[s]):

<a href="javascript:void(alert('clicked'); var x=9; alert(x*3);)">Click Me</a>

Unless you are using the this keyword in your onclick, I think this is a better way of doing things.

06-08-2007, 06:43 PM
It's not. It's a very poor way of doing things. It's an abuse of both the href attribute and the javascript: pseudo-URL scheme. Links with href attributes are meant to direct the browser somewhere, and at least IE assumes this and begins closing down the page ready to load a new page, by stopping animated images for example.

Furthermore, if you have links calling Javascript to which you can apply no more appropriate fallback than "#", then the chances are they shouldn't be links at all.

06-08-2007, 06:58 PM
The main reason why I don't like "#" is because it messes up with the back and forward buttons, but then again, I didn't know about that IE thing.

So I guess the best thing to do could be using css to make a span class behave like a link visually and give it onclick attributes.

06-08-2007, 07:19 PM
A button would be more semantically appropriate, actually. The <span> is better than using a link, though, certainly.

06-08-2007, 08:49 PM
But in some cases you have to use a link. Like if need to use the tab index.

06-08-2007, 11:05 PM
Buttons can have a tabindex too.

06-09-2007, 02:48 AM
You can mix javascript:void() and onclick, or even make custom 'javascript:' links that are informative while doing nothing else. This may not be the best way in certain respects, but causes no problems in the majority of browsers (any that I know of), and can be, as I said, informative. For example, if you have links that change images:

<a href="javascript:next()" onclick="changeImage(1);return false;">Next</a>
<a href="javascript:previous()" onclick="changeImage(-1);return false;">Previous</a>

These 'links' will never fire, but will show up in the status bar and/or other places in many browsers, giving the user information about what will happen if they click. The functions, next() and previous() don't even need to exist.

06-09-2007, 09:22 AM
Well the reason i want to achieve this is because i don't want to manually add the function in every anchor tag with href="#".
If i have 15 anchor tags with href="#" in evety page, i want to assign to all of them an action.

But for some reason this
if(deadlinks[i].href == '#') is not working. Is it some way that i can get what is the value of the href??

06-09-2007, 12:07 PM
The browser will convert the href to an absolute form, so you really want to check:
if(deadlinks[i].href.lastIndexOf("#") === deadlinks[i].href.length - 1)

06-09-2007, 02:37 PM
The browser will convert the href to an absolute form, so you really want to check:
if(deadlinks[i].href.lastIndexOf("#") === deadlinks[i].href.length - 1)

On a page called - say, some.htm, that will pick up:

<a href="index.html#">Hi</a>

as well as:

<a href="#">Hi</a>

the first of which is not a 'dead' link, though it is sloppy coding.

06-09-2007, 03:09 PM
I noticed this at the time, but since I see no reason anyone would have "index.html#", I decided to not worry about it.

06-09-2007, 03:24 PM
Thanks Twey..it worked for me.

Thanx also John for the tip, but i don't intend to use
<a href="index.html#">Hi</a>, so no problem. Good to know it anyway..