Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Don't use regex to parse HTML. [X][HT]ML is not a regular language and cannot reliably be processed using regex. Your browser has a good HTML parser built-in; let that take the strain of working out where the tags are.</p> <p>Also you don't really want to work on <code>html()/innerHTML</code> on body. This will serialise and re-parse the entire page, which will be slow and will lose any information that cannot be serialised in HTML, such as event handlers, form values and other JavaScript references.</p> <p>Here's a method using DOM that seems to work for me:</p> <pre><code>function replaceInElement(element, find, replace) { // iterate over child nodes in reverse, as replacement may increase // length of child node list. for (var i= element.childNodes.length; i--&gt;0;) { var child= element.childNodes[i]; if (child.nodeType==1) { // ELEMENT_NODE var tag= child.nodeName.toLowerCase(); if (tag!='style' &amp;&amp; tag!='script') // special case, don't touch CDATA elements replaceInElement(child, find, replace); } else if (child.nodeType==3) { // TEXT_NODE replaceInText(child, find, replace); } } } function replaceInText(text, find, replace) { var match; var matches= []; while (match= find.exec(text.data)) matches.push(match); for (var i= matches.length; i--&gt;0;) { match= matches[i]; text.splitText(match.index); text.nextSibling.splitText(match[0].length); text.parentNode.replaceChild(replace(match), text.nextSibling); } } // keywords to match. This *must* be a 'g'lobal regexp or it'll fail bad var find= /\b(keyword|whatever)\b/gi; // replace matched strings with wiki links replaceInElement(document.body, find, function(match) { var link= document.createElement('a'); link.href= 'http://en.wikipedia.org/wiki/'+match[0]; link.appendChild(document.createTextNode(match[0])); return link; }); </code></pre>
 

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