И что бы поставить точку в теме, альтернативное решение: найти в тексте материала слово или слова и выделить их цветом.
Создать файл "highlight.js" и записать его на хостинг:
// highlight
$.fn.highlight = function (b, k) {
function l() {
$("." + c.className).each(function (c, e) {
var a = e.previousSibling,
d = e.nextSibling,
b = $(e),
f = "";
a && 3 == a.nodeType && (f += a.data, a.parentNode.removeChild(a));
e.firstChild && (f += e.firstChild.data);
d && 3 == d.nodeType && (f += d.data, d.parentNode.removeChild(d));
b.replaceWith(f)
})
}
function h(b) {
b = b.childNodes;
for (var e = b.length, a; a = b[--e];)
if (3 == a.nodeType) {
if (!/^\s+$/.test(a.data)) {
var d = a.data,
d = d.replace(m, '<span class="' + c.className + '">$1</span>');
$(a).replaceWith(d)
}
} else 1 == a.nodeType && a.childNodes && (!/(script|style)/i.test(a.tagName) && a.className != c.className) && h(a)
}
var c = {
split: "\\s+",
className: "highlight",
caseSensitive: !1,
strictly: !1,
remove: !0
}, c = $.extend(c, k);
c.remove && l();
b = $.trim(b);
var g = c.strictly ? "" : "\\S*",
m = RegExp("(" + g + b.replace(RegExp(c.split, "g"), g + "|" + g) + g + ")", (c.caseSensitive ? "" : "i") + "g");
return this.each(function () {
b && h(this)
})
};
$(function () {
$('#scan').click(function () {
var settings = {};
var pattern = $('#pattern').val();
$("#right").prop("checked") && (settings.strictly = true);
$("#case").prop("checked") && (settings.caseSensitive = true);
$("#remove").prop("checked") && (settings.remove = false);
pattern && $("div").highlight(pattern, settings)
})
})
В материал статьи вставить:
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://your-site.com/templates/t3_blank/js/highlight.js"></script>
<form>
<input id="pattern" name="" value="Что ищем"><label>Слова через пробел|ы</label><br>
<input id="right" name="" type="checkbox"><label>Точное совпадение</label><br>
<input id="case" name="" type="checkbox"><label>Учитывать регистр</label><br>
<input id="remove" name="" type="checkbox"><label>Сохранить предыдущее выделение</label><br>
<input id="scan" name="" type="button" value="Найти">
</form>
Поправьте путь к скрипту highlight.js на вашем сайте, у меня так, в папке шаблона: "
http://your-site.com/templates/t3_blank/js/highlight.js",
но можно и в отдельную папку "js": "
http://your-site.com/js/highlight.js"
Изменить стиль подсветки можно так например:
span.highlight {
background-color: #ddd;
border-radius: 4px 4px 4px 4px;
padding: 4px 14px;
}
Взято от сюда:
http://javascript.ru/forum/project/40276-jquery-highlight-plugin-%E2%80%94-podsvetka-slov-v-tekste.html