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, & 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>
To remove a hyperlink but keep the text, right-click the hyperlink and click Remove Hyperlink. To remove the hyperlink completely, select it and then press Delete.
Disable a link # It is still possible to disable a link by following 3 steps: remove the href attribute so that it can no longer receive the focus. add a role="link" so that it is always considered a link by screen readers. add an attribute aria-disabled="true" so that it is indicated as being disabled.
Just select the text where you want to remove the links, click the Insert/edit link, then leaving all fields empty click Ok.
Open the Inspector palette. Select the second last tab called "Link Inspector", then highlight the link itself. Click the "Enable as a hyperlink" checkbox to off and it will disappear.
If you can include jquery, you can do it simply with
$('document').ready(function (){
$('a').contents().unwrap();
});
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]);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With