Convert all HTML Links to another URL with HTML and Javascript

Question

I am trying get all HTML links in a website's body section within a string and replace them to another link.

Tried something like this but did not work:

var search = "https://www.cloudflare.com/5xx-error-landing?utm_source=error_footer";
var replacement = "https://example.com/";

document.body.innerHTML = document.body.innerHTML.split(search).join(replacement)

Where "https://www.cloudflare.com/5xx-error-landing?utm_source=error_footer" is the link I want to replace and "https://example.com/" is the link that I want to replace with.

Is it only that one specific link you want to change within the entire page? — Rory McCrossan
– Rory McCrossan, Commented Jul 10, 2017 at 7:54

Nir Tzezana · Accepted Answer · 2017-07-10 08:24:02Z

5

How about this:

$("[href='your link']").attr("href","new link");

edited Jul 10, 2017 at 8:24

answered Jul 10, 2017 at 7:55

Nir Tzezana

2,3423 gold badges34 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Koushik Chatterjee Over a year ago

the question is about only JavaScript I guess

daremachine Over a year ago

@KoushikChatterjee sorry but tagged by jquery

Nir Tzezana Over a year ago

Edited and reduced the ==, now just using a css selector

Koushik Chatterjee Over a year ago

any getter will return you the value of first element, but any setter will set it to all the elements that matches the selector, because you are doing against that. just try it out :)

Koushik Chatterjee Over a year ago

@NirTzezana thanks for the edit, its a more optimized answer now. Looks good :) thums up ^

|

Koushik Chatterjee · Accepted Answer · 2017-07-10 08:14:11Z

0

Here is a solution with plain javascript as per your question

document.querySelectorAll("[href='" + search + "']").forEach(function(el){
    el.href = replacement );
});

If you want to use jQuery, as you tagged, follow the answer of Nir Tzezana

edited Jul 10, 2017 at 8:14

answered Jul 10, 2017 at 8:04

Koushik Chatterjee

4,1933 gold badges20 silver badges32 bronze badges

Comments

Wordica · Accepted Answer · 2017-07-10 08:16:51Z

0

$('body').find('a').each(function(){
    $(this).attr('href','your_new_link');
});

or for different href:

$('body').find('a').each(function(){
    var ahref = $(this).attr('href');
    if ( ahref == 'your_old_link') {  /// or ahref.indexOf("your_old_link") >= 0
         $(this).attr('href','your_new_link_1');
    }else{
         $(this).attr('href','your_new_link_2');
    }

});

edited Jul 10, 2017 at 8:16

answered Jul 10, 2017 at 7:59

Wordica

2,6033 gold badges36 silver badges59 bronze badges

2 Comments

daremachine Over a year ago

its not correct because ahref is string .. you can not call .attr because is not jquery Object ... you tried yourself?

daremachine Over a year ago

yes now its correct. $(this) is good but for replace and nested is it hell, I like using store that into variable like this jsfiddle.net/rqxdLp88

Masum billah · Accepted Answer · 2017-07-10 08:29:49Z

0

Just use

  $("body a[href='https://www.cloudflare.com']").attr("href","https://example.com/");

edited Jul 10, 2017 at 8:29

answered Jul 10, 2017 at 8:00

Masum billah

9821 gold badge7 silver badges26 bronze badges

3 Comments

daremachine Over a year ago

this is bad because replace ALL links but OP wants to replace only specific links

Koushik Chatterjee Over a year ago

is .each is required here?

Koushik Chatterjee Over a year ago

any getter will return you the value of first element, but any setter will set it to all the elements that matches the selector, because you are doing against that. just try it out :

Collectives™ on Stack Overflow

Convert all HTML Links to another URL with HTML and Javascript

4 Answers 4

7 Comments

Comments

2 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

7 Comments

Comments

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related