4.10. Replacing an element with new content [Dive Into Greasemonkey]

4.10. Replacing an element with new content

Once you find an element, you can replace it with entirely new content, using the replaceChild function.

Example: Replace an image with its alt text

This presumes that there is an element whose ID is "annoyingsmily".

var theImage, altText;
theImage = document.getElementById('annoyingsmily');
if (theImage) {
    altText = document.createTextNode(theImage.alt);
    theImage.parentNode.replaceChild(altText, theImage);
}

If you want to replace an element with a large chunk of HTML, you can construct the HTML as a string and then set the element's innerHTML property.

Real examples

Frownies

← Removing an element

Inserting complex HTML quickly →