So I have a cool one for ya.

I need to scan my html document as it is rendering and replace every

href=""

with

onclick="window.location=''"

more than that, I need to carry the link from the href to the window.location.

For example, if I had:

href=""

it would become:

onclick="window.location=''"

and I need it to do this on every href in the document

I have no idea, but it needs to be in jQuery / javascript :D

Thanks guys.

So I have a cool one for ya.

I need to scan my html document as it is rendering and replace every

href=""

with

onclick="window.location=''"

more than that, I need to carry the link from the href to the window.location.

For example, if I had:

href="http://www.google.com.au"

it would become:

onclick="window.location='http://www.google.com.au'"

and I need it to do this on every href in the document

I have no idea, but it needs to be in jQuery / javascript :D

Thanks guys.

• javascript
• jquery

• you want to replace href with onclick, or add onclick to anchor tags..? – Sudhir Bastakoti Commented Feb 23, 2012 at 4:00
• I need to find every anchor tag, replace the href with an onclick. – Ben Potter Commented Feb 23, 2012 at 4:02
• Can you give us more information on why you would want to do this? As far as I know, the functionality would be equivalent, except that the new code wouldn't work with JavaScript disabled. – fullsailor Commented Feb 23, 2012 at 4:03
• @jfriend00 – I can't see how the page won't work if the JS is off? He'll only have removed the href attributes if JS is on. – djd Commented Feb 23, 2012 at 4:08
• 1 when you have a page saved to your ipad screen as an app, and disable the safari address bar with metadata, you can only use window.location to keep it in the anti-bar browser. using an href launches the safari browser itself. – Ben Potter Commented Feb 23, 2012 at 4:14

3 Answers 3

You could try this:

$('a').each(function() {
  var href = $(this).attr('href');
  $(this).attr('onclick', "window.location='" + href + "'")
         .removeAttr('href');
});

What are you trying to achieve with this? Chances are that there's a more elegant way to achieve what you're after.

For example, it might be better to handle the event yourself in the JS. Replace the third line with:

$(this).click(function() { window.location = href; })

That could become very expensive though, so you might want to consider jQuery's delegate events: http://api.jquery.com/delegate/

This should achieve what you want...

$('a[href]').click(function(event) {
   event.preventDefault();
   window.location = this.href;
});

I assume you wanted to prevent default behaviour of links.

For all possible links, you could use document.links.

For all links and future links, use event delegation.

$('body').on('click', 'a[href]', function() {
       window.location = this.href;
});

Some non-jQuery variants:

Keep href:

var i = document.links.length;
while (i--) 
  document.links[i].onclick = function(){window.location = this.href;};

Keep href and don't follow it if onclick called (even though it goes to the same place):

var i = document.links.length;
while (i--) 
  document.links[i].onclick = function() {
    window.location = this.href;
    return false;
  };

Remove href:

var i = document.links.length,
    link;
while (i--) {
  link = document.links[i]; 
  link.onclick = (function(href) {
    return function() {
        window.location = href;
    }(link.href));
  link.href = '';
}
link = null;

Of course I don't understand why you want to replace a robust, works everywhere solution with an unreliable, easily broken one.