Question

Basically, I want to do the opposite of this: how do i hide anchor text without hiding the anchor

I’d like to be able to have a link on my page which under a certain set of client-side determined conditions would be able to deactivate the link, but still show the text. Is there any way to do this without having two separate elements (one with both the anchor and the text and one with just the text) and then flipping visibility between the two?

EDIT: Sorry, should have clarified. I’d like the link to not be styled like a link when it’s deactivated.

Answer 1

Replace the <a> with a generic <span>, and back again.

A simple strategy to replace would be:

1. find the node.
2. add the replaced node before it
3. remove the first node

—

var node = document.getElementById("example");
var new_node = document.createElement("a"); // or "span"
new_node.innerText = text;
node.parentNode.insertBefore(new_node, node);
node.parentNode.removeChild(node);

This code isn’t complete, but just to give you an idea.