Result
jQuery
/*
highlight v3
Highlights arbitrary terms.
<http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html>
MIT license.
Johann Burkard
<http://johannburkard.de>
<mailto:jb@eaio.com>
*/
jQuery.fn.highlight = function(pat) {
function innerHighlight(node, pat) {
var skip = 0;
if (node.nodeType == 3) {
var pos = node.data.toUpperCase().indexOf(pat);
if (pos >= 0) {
//文字をspanで囲んでclass付与
var spannode = document.createElement('span');
spannode.className = 'highlight';
var middlebit = node.splitText(pos);
var endbit = middlebit.splitText(pat.length);
var middleclone = middlebit.cloneNode(true);
spannode.appendChild(middleclone);
middlebit.parentNode.replaceChild(spannode, middlebit);
skip = 1;
}
}
else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
for (var i = 0; i < node.childNodes.length; ++i) {
i += innerHighlight(node.childNodes[i], pat);
}
}
return skip;
}
return this.each(function() {
innerHighlight(this, pat.toUpperCase());
});
};
//文字を指定して再度class付与
$(function() {
$('body').highlight("™");
$('span.highlight:contains("™")').addClass("trade");
$('body').highlight("©");
$('span.highlight:contains("©")').addClass("copyright");
$('body').highlight("♥");
$('span.highlight:contains("♥")').addClass("heart");
$('body').highlight("&");
$('span.highlight:contains("&")').addClass("ampersand");
});
css
.highlight.trade {
font-family: Georgia, serif;
color: blue; }
.highlight.copyright {
font-family: Georgia, serif;
color: red; }
.highlight.heart {
color: green; }
html
<p>商標 ™</p> <p>コピーライト ©</p> <p>ハート ♥</p>
via
http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
http://forrst.com/posts/Styling_HTML_Entities-s0Q
