How to Find and Replace Text in Gmail and other Web Pages

Search and Replace for any Webpage

While you are on the web page, press Ctrl+Shift+J on Windows or Cmd+Opt+J on Mac to open the Console window inside Chrome Developer tools. Now enter the following command to replace all occurrences of the word ABC with XYZ.

document.body.innerHTML = document.body.innerHTML.replace(/ABC/g, "XYZ")

You can use Regular Expressions for more complex substitutions. For instance, if you wish to replace all common misspellings of occurrence, you could use either of these:

 document.body.innerHTML.replace(/(ocurrance|occurrance|occurance)/g, "occurrence")
 document.body.innerHTML.replace(/oc[\w]+nce/g, "occurrence")

The same technique can be used to format words inside a page as well. For instance, the next command will bold all instances of the word Hello on a page.

document.body.innerHTML.replace(/Hello/g, "<b>Hello</b>")

Search and Replace Text in Gmail

On Gmail ,You may have written a lengthy email but just when you were about to hit Send, you come across some spelling errors.

To fix the errors in Gmail, you can either copy the email message into notepad, perform search and replace and then paste the edited text back into Gmail. Or you can directly use Chrome Dev Tools.

The first step is to find the element on page where the search & replace should be done. This is easy as shown in the video above. Select the Gmail text, right-click and choose Inspect Element and make a note of the DIV ID that contains the editable textarea. It is “:h7” for Gmail.

Now all we need to is run the substitution command inside the Console window to replace word ABC with XYZ everywhere.

document.getElementById(':h7').innerHTML = 
  document.getElementById(':h7').innerHTML.replace(/ABC/g, "XYZ");

And your changes won’t be lost as Gmail will auto-save your Draft.