I'm making a fun little script that replaces specific letters with the replace() function across an entire web page. To clarify, I'm editing an existing website like Google or Reddit by inserting this script into the console.

Here's the idea I've tried. I stored all of the web page's innerText in a single variable:

var d = document.documentElement.innerText;

Then replaced every instance of a specific letter within the variable's contents:

d = d.replace(/r/gi, "w");

And finally set the original innerText to the value of the variable:

document.documentElement.innerText = d;

Unfortunately, what this does is it breaks all CSS styles and HTML tags and leaves me with plain text on a web page. It successfully replaces the right letters, but essentially breaks the page.

In short, how do I change large quantities of text in a web page without changing the whole thing into plain text?

0 Answers