Search code examples
google-chrome-extensionfirefox-addonhighlighting

Highlight text in textbox without modifying the markup


I was wondering if it were possible to write an extension for a browser which would change the color of text, or otherwise transform it (underline, bold, etc) without modifying the markup.

As an example:

HTML

<p>Extensions use JS, and have to modify the DOM<p>

Default Rendering

Extensions use JS, and have to modify the DOM

Desired Rendering

Extensions use JS, and have to modify the DOM

Now, I know that Extensions can modify the DOM, and to get what I wanted I could get something like:

<p>Extensions use JS, and <html:span style="font-weight: bold; font-style: italic;">have</html:span> to modify the DOM</p>

So, what I'm trying to do is NOT change the markup, at all. This would be something like the "Highlight all" functionality that you get when you're doing a "Find" on a page.

Current Solution

I found an extension which fits as a viable solution to my problem: It's All Text!

While I would still like to have native browser highlighting, without modifying the markup, this will do fine.


Solution

  • I found an extension which fits as a viable solution to my problem: It's All Text!

    While I would still like to have native browser highlighting, without modifying the markup, this will do fine.

    This pulls it out of the page, into an editor, and syncs them up. Works beautifully.