Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>When you load a text file as a web page in your browser, your browser creates a bare-bones HTML scaffolding around the text:</p> <pre><code>&lt;html&gt; &lt;head&gt;&lt;/head&gt; &lt;body&gt; &lt;pre&gt;[your entire text document here]&lt;/pre&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>This doesn't show up if you view the source of the page, but it is visible if you insect the page (e.g. with Firebug or Chrome dev tools).</p> <p>A simple way to manipulate and style the text is to grab the <code>innerHTML</code> of the <code>&lt;pre&gt;</code> block and add tags into it:</p> <pre><code>function highlightText(regexStr) { var preTag = document.getElementsByTagName("pre")[0]; preTag.innerHTML = preTag.innerHTML .replace(new RegExp("("+regexStr+")", "g"), "&lt;span style='background-color:orange;'&gt;$1&lt;/span&gt;"); } highlighText("some regex phrase to highlight"); </code></pre> <p>Add whatever styles you like in the <code>&lt;span&gt;</code> to achieved the desired highlighting effect.</p> <p>Note that the string you pass into <code>highlightText</code> is used in a regex, so you should escape special regex characters like <code>$</code> and <code>^</code> before you pass the string into the function (or make the function sanitize its own input). This has been addressed in <a href="https://stackoverflow.com/questions/494035/how-do-you-pass-a-variable-to-a-regular-expression-javascript/494122#494122">How do you pass a variable to a Regular Expression JavaScript?</a>:</p> <pre><code>str.replace(/([.?*+^$[\]\\(){}|-])/g, "\\$1"); </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload