Remove links with JavaScript in browser

Question

How do I remove links from a webpage with JavaScript? I am using Google Chrome. The code I tried is:

function removehyperlinks() {
    try {
        alert(document.anchors.length);
        alert(document.getElementsByTagName('a'));
        for(i=0;i=document.anchors.length;i++) {
            var a = document.anchors[i];
            a.outerHTML = a.innerHTML;
            var b = document.getElementsByTagName('a');
            b[i].outerHTML = b[i].innerHTML;
        }
    } catch(e) { alert (e);}
    alert('done');
}

Of course, this is test code, which is why I have the alerts and 2 things trying at the same time. The first alert returns "0" the second [Object NodeList] and the third returns "done".

My html body looks like this:

<body onload="removehyperlinks()">
<ol style="text-align:left;" class="messagelist">
    <li class="accesscode"><a href="#">General information, Updates, &amp;   Meetings<span class="extnumber">141133#</span></a>
        <ol>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li><a href="#">...</a></li>
            <li start="77"><a href="#"">...</a></li>
            <li start="88"><a href="#">...</a></li>
            <li start="99"><a href="#">...</a></li>
        </ol>
    </li>
  </ol>
</body>

Justin Johnson · Accepted Answer · 2020-12-05 09:38:56Z

8

Here's some vanilla JS that does the trick. All it does is replace a tags with span's and copies over class and id attributes (if they exist).

var anchors = document.querySelectorAll("A");

for ( var i=0; i < anchors.length; i++ ) {
    var span = document.createElement("SPAN");
    if ( anchors[i].className ) {
        span.className = anchors[i].className;
    }

    if ( anchors[i].id ) {
        span.id = anchors[i].id;
    }

    span.innerHTML = anchors[i].innerHTML;

    anchors[i].parentNode.replaceChild(span, anchors[i]);
}

edited Dec 5, 2020 at 9:38

answered Mar 31, 2010 at 20:33

Justin Johnson

31.4k7 gold badges67 silver badges89 bronze badges

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

5 Comments

neoswf Over a year ago

Thank you! Just a small comment - i < anchors.length needs to be i <= anchors.length in order to not break.

neoswf Over a year ago

if you got 3 anchors childs, your loop will run only twice

Justin Johnson Over a year ago

I do not see how. If anchors.length == 3, then i = 0, 1, 2.

Anderson Green Over a year ago

This sometimes works, but not always. When I ran this script on the Stack Overflow home page, many of the links were not removed.

Justin Johnson Over a year ago

Using querySelectorAll fixes it.

AdmSteck · Accepted Answer · 2010-03-31 20:06:23Z

7

If you can include jquery, you can do it simply with

$('document').ready(function (){
    $('a').contents().unwrap();
});

answered Mar 31, 2010 at 20:06

AdmSteck

1,76115 silver badges25 bronze badges

2 Comments

Arlen Beiler Over a year ago

How can I get JQuery and how do I use it?

Christopher Altman Over a year ago

You can also reference the Google Hosted jQuery file. code.google.com/apis/ajaxlibs/documentation/#jquery example: <script src="ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> The benefit is that if your user already visited another site referencing the shared file, it is likely in the user's cache.

Arlen Beiler · Accepted Answer · 2010-04-01 02:11:09Z

3

function removehyperlinks() {
    try {
        for(i=0;i<document.anchors.length;i++) {
            document.anchors[i].outerHTML = document.anchors[i].innerHTML
        }
    } catch(e) { alert ("try2:" + e);}
}
function runner() {
    for(i=1;document.anchors.length > 0;i++) {
        //alert('run ' + i + ':' + document.anchors.length);
        removehyperlinks();
    }
}

This works. As I am in control of the content, I named all the anchors "link" using a simple search and replace. If you run it once, it takes out every other one. So I just had it repeat, as you can see, till they are all out.

answered Apr 1, 2010 at 2:11

Arlen Beiler

16k35 gold badges98 silver badges138 bronze badges

1 Comment

Arlen Beiler Over a year ago

As an explanation, it wouldn't show up in the anchors list unless it had the name attribute set. Also, the reason it takes out every other one is because when you delete the first one, the second one becomes the first one, and you move to the second one, delete that, and the third... You get the idea. I didn't understand that back then, I guess. What would work fine is a while loop. While (document.anchors.length > 0) doc.anc[0].outHTML = doc.anc[0].inHTML;

Deke · Accepted Answer · 2018-04-25 19:20:39Z

2

You can use removeAttribute:

var allImages = document.querySelectorAll('.imageLinks');

function removehyperlinks()(){  
    for (var i = 0; i < allImages.length; i++) {
    allImages[i].removeAttribute("href");
  }
}

removehyperlinks()()

answered Apr 25, 2018 at 19:20

Deke

4,6875 gold badges49 silver badges72 bronze badges

Comments

Robusto · Accepted Answer · 2010-03-31 20:39:47Z

1

Try

var ary = document.getElementsByTagName("a");

to get the anchors.

Then you can remove them like this

for (var i=0;i<ary.length;i++) {
  // brain cramp: document.removeElement(ary[i]);
  ary[i].parentNode.removeChild(ary[i]);
}

edited Mar 31, 2010 at 20:39

answered Mar 31, 2010 at 19:59

Robusto

32k8 gold badges59 silver badges79 bronze badges

3 Comments

Robusto Over a year ago

@Arien Beller: D'oh! Sorry, just saw you trying to use document.anchors, which is what you're using in your loop anyway. This should do what you want about finding and removing them, because what you have is not iterating through the elements and even if it were it would just be removing the text contents of the anchor tag, not the element itself.

Arlen Beiler Over a year ago

I used both alert(document.anchors.length); (0) alert(document.getElementsByTagName('a')); ([Object NodeList])

Cesar Over a year ago

This doesn't seem to work correctly because ary.length is dynamic and changes with every removal.

Vladimir Miroshnichenko · Accepted Answer · 2020-09-10 19:54:53Z

1

in one line

document.querySelectorAll(".description a").forEach(a => a.outerHTML = a.innerHTML);

answered Sep 10, 2020 at 19:54

Vladimir Miroshnichenko

1,29510 silver badges9 bronze badges

Comments

user3696815 · Accepted Answer · 2025-02-23 18:38:43Z

The shortest one that works for me from the browser console I copied from this answer:

[...document.getElementsByTagName('a')].map(a => a.removeAttribute("href"));

a {
  color: red;
  text-decoration: underline;
}

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Example Links</title>
</head>

<body>
  <h1>Example Links</h1>
  <p>Here are some useful links:</p>
  <ul>
    <li><a href="https://www.google.com" target="_blank">Google</a></li>
    <li><a href="https://www.wikipedia.org" target="_blank">Wikipedia</a></li>
    <li><a href="https://www.github.com" target="_blank">GitHub</a></li>
  </ul>
  <p><a href="#footer">Jump to Footer</a></p>

  <h2 id="footer">Footer Section</h2>
  <p>Back to <a href="#top">Top</a></p>
</body>

</html>

But, as you can see from the snippet, it only stops links from behaving like links, but? if they styled in CSS, visually they still going to look like links.

In this case you may replace links with span while keeping the content, you can modify the JavaScript like this:

[...document.getElementsByTagName('a')].forEach(a => {
  let text = a.textContent;
  let span = document.createElement('span');
  span.textContent = text;
  a.replaceWith(span);
});

Collectives™ on Stack Overflow

Remove links with JavaScript in browser

7 Answers 7

5 Comments

2 Comments

1 Comment

Comments

3 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

5 Comments

2 Comments

1 Comment

Comments

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related