Показать сообщение отдельно
  #3 (permalink)  
Старый 01.05.2014, 20:00
Аватар для danik.js
Профессор
Отправить личное сообщение для danik.js Посмотреть профиль Найти все сообщения от danik.js
 
Регистрация: 11.09.2010
Сообщений: 8,804

Пример без jQuery, на NodeIterator'е. Как и плагин, также игнорирует частично-форматированные слова и слова с мягким переносом.
<!DOCTYPE html>
<meta charset="utf-8" />
<style>
	span{
		background: yellow;
	}
</style>
<p>подскажите/натолкните на мысль, как с помощью jQuery сделать так, чтобы он нашёл в документе все слова (например, "программирование), и обрамил их в тег &lt;span>? </p>
<p>
можно конечно ручками переписать всё body и добавить теги нужным словам, но задача именно в этом - не трогая html при нажатии кнопки изменить цвет слова "программирование" "программирование" во всём документе.
</p>
<script>
(function() {

var needle = 'программирование';

var nodeIterator = document.createNodeIterator(document.body, NodeFilter.SHOW_TEXT);

var currentNode;
while (currentNode = nodeIterator.nextNode()) {
	var substringIndex = currentNode.data.indexOf(needle);
	if (substringIndex > -1) {
		var span = document.createElement('span');
		span.appendChild(document.createTextNode(currentNode.data.substring(substringIndex, substringIndex + needle.length)));
		var remainder = document.createTextNode(currentNode.data.substring(substringIndex + needle.length));
		currentNode.data = currentNode.data.substring(0, substringIndex);
		currentNode.parentNode.insertBefore(span, currentNode.nextSibling);
		currentNode.parentNode.insertBefore(remainder, span.nextSibling);
		// skip span
		nodeIterator.nextNode();
	}
}

})();
</script>
__________________
В личку только с интересными предложениями
Ответить с цитированием