Question

This script:

$(function() {
    $('a').each(function() {
        var href = $(this).attr('href');
        if ("a:not(http://)") {
            $(this).attr('href', '/' + href);
        }
    });
});

Add the slash to every link even links with the contain “http://” Not sure why? I do not get any errors?

Any ideas on how I can fix this?

Answer 1

You mixed up two things:

• jQuery selectors:

  $(function() {
      $('a:not([href^="http://"])').each(function() {
          var href = $(this).attr('href');
          $(this).attr('href', '/' + href);  
      });
  });
  

• and pure javascript if statements:

  $('a').each(function() {
     var href = $(this).attr('href');
     if (href.substr(0, 'http://'.length) == 'http://'){
         $(this).attr('href', '/' + href); 
     }   
  });
  

Both do the same.

Note that they will generate invalid links for other schemes than http (e.g. /https://example.com/index.html). Depending on how clean the HTML code you’re working with is, you may simply look for the colon to identify absolute links:

$(function() {
    $('a:not([href*=":"])').each(function() {
        var href = $(this).attr('href');
        $(this).attr('href', '/' + href);  
    });
});