]>
Commit | Line | Data |
---|---|---|
1b647ff4 DS |
1 | /* |
2 | * jQuery Highlight plugin | |
3 | * | |
4 | * Based on highlight v3 by Johann Burkard | |
5 | * http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html | |
6 | * | |
7 | * Code a little bit refactored and cleaned (in my humble opinion). | |
8 | * Most important changes: | |
9 | * - has an option to highlight only entire words (wordsOnly - false by default), | |
10 | * - has an option to be case sensitive (caseSensitive - false by default) | |
11 | * - highlight element tag and class names can be specified in options | |
12 | * | |
13 | * Usage: | |
14 | * // wrap every occurrance of text 'lorem' in content | |
15 | * // with <span class='highlight'> (default options) | |
16 | * $('#content').highlight('lorem'); | |
17 | * | |
18 | * // search for and highlight more terms at once | |
19 | * // so you can save some time on traversing DOM | |
20 | * $('#content').highlight(['lorem', 'ipsum']); | |
21 | * $('#content').highlight('lorem ipsum'); | |
22 | * | |
23 | * // search only for entire word 'lorem' | |
24 | * $('#content').highlight('lorem', { wordsOnly: true }); | |
25 | * | |
26 | * // don't ignore case during search of term 'lorem' | |
27 | * $('#content').highlight('lorem', { caseSensitive: true }); | |
28 | * | |
29 | * // wrap every occurrance of term 'ipsum' in content | |
30 | * // with <em class='important'> | |
31 | * $('#content').highlight('ipsum', { element: 'em', className: 'important' }); | |
32 | * | |
33 | * // remove default highlight | |
34 | * $('#content').unhighlight(); | |
35 | * | |
36 | * // remove custom highlight | |
37 | * $('#content').unhighlight({ element: 'em', className: 'important' }); | |
38 | * | |
39 | * | |
40 | * Copyright (c) 2009 Bartek Szopka | |
41 | * | |
42 | * Licensed under MIT license. | |
43 | * | |
44 | */ | |
45 | ||
46 | jQuery.extend({ | |
47 | highlight: function (node, re, nodeName, className) { | |
48 | if (node.nodeType === 3) { | |
49 | var match = node.data.match(re); | |
50 | if (match) { | |
51 | var highlight = document.createElement(nodeName || 'span'); | |
52 | highlight.className = className || 'highlight'; | |
53 | var wordNode = node.splitText(match.index); | |
54 | wordNode.splitText(match[0].length); | |
55 | var wordClone = wordNode.cloneNode(true); | |
56 | highlight.appendChild(wordClone); | |
57 | wordNode.parentNode.replaceChild(highlight, wordNode); | |
58 | return 1; //skip added node in parent | |
59 | } | |
60 | } else if ((node.nodeType === 1 && node.childNodes) && // only element nodes that have children | |
61 | !/(script|style)/i.test(node.tagName) && // ignore script and style nodes | |
62 | !(node.tagName === nodeName.toUpperCase() && node.className === className)) { // skip if already highlighted | |
63 | for (var i = 0; i < node.childNodes.length; i++) { | |
64 | i += jQuery.highlight(node.childNodes[i], re, nodeName, className); | |
65 | } | |
66 | } | |
67 | return 0; | |
68 | } | |
69 | }); | |
70 | ||
71 | jQuery.fn.unhighlight = function (options) { | |
72 | var settings = { className: 'highlight', element: 'span' }; | |
73 | jQuery.extend(settings, options); | |
74 | ||
75 | return this.find(settings.element + "." + settings.className).each(function () { | |
76 | var parent = this.parentNode; | |
77 | parent.replaceChild(this.firstChild, this); | |
78 | parent.normalize(); | |
79 | }).end(); | |
80 | }; | |
81 | ||
82 | jQuery.fn.highlight = function (words, options) { | |
83 | var settings = { className: 'highlight', element: 'span', caseSensitive: false, wordsOnly: false }; | |
84 | jQuery.extend(settings, options); | |
85 | ||
86 | if (words.constructor === String) { | |
87 | words = [words]; | |
88 | } | |
89 | words = jQuery.grep(words, function(word, i){ | |
90 | return word != ''; | |
91 | }); | |
92 | words = jQuery.map(words, function(word, i) { | |
93 | return word.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&"); | |
94 | }); | |
95 | if (words.length == 0) { return this; }; | |
96 | ||
97 | var flag = settings.caseSensitive ? "" : "i"; | |
98 | var pattern = "(" + words.join("|") + ")"; | |
99 | if (settings.wordsOnly) { | |
100 | pattern = "\\b" + pattern + "\\b"; | |
101 | } | |
102 | var re = new RegExp(pattern, flag); | |
103 | ||
104 | return this.each(function () { | |
105 | jQuery.highlight(this, re, settings.element, settings.className); | |
106 | }); | |
107 | }; | |
108 |