Показать сообщение отдельно
  #7 (permalink)  
Старый 15.08.2013, 15:57
Аватар для ruslan_mart
Профессор
Отправить личное сообщение для ruslan_mart Посмотреть профиль Найти все сообщения от ruslan_mart
 
Регистрация: 30.04.2012
Сообщений: 3,018

Вот, за полчаса тут написал, возиться долго не хочу, поэтому улучшайте сами.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Документ без названия</title>
<style type="text/css">
.wordSelected {
	background: #066;
	border: 1px solid #F30;
	color: #FFF;
}
.wordFocused {
	background: #FFF;
}
</style>
</head>

<body>
<div id="myText">«Меня зашвыривают внутрь. Успеваю увидеть стол, на котором лежит здоровенный продолговатый пакет на застежке – старший вожатый тут же его загораживает, кучу инструментов, нашего доктора с лицом таким усталым и брезгливым, что молодость ему не идет, и раму с дверной ручкой на окне».<br />
«Меня зашвыривают внутрь. Успеваю увидеть стол, на котором лежит здоровенный продолговатый пакет на застежке – старший вожатый тут же его загораживает, кучу инструментов, нашего доктора с лицом таким усталым и брезгливым, что молодость ему не идет, и раму с дверной ручкой на окне».</div>

<input type="button" onclick="Word.selected('стол', 'myText')" value="Найти 'стол'" />
<input type="button" onclick="Word.deleted()" value="Удалить выделения" />
<input type="button" onclick="Word.focused()" value="Focus +" />

<script type="text/javascript">
var Word = {
	selected: function(word, where, del) {
		where = typeof where == 'string' ? document.getElementById(where) : where || console.log('Error');
		if(!where) return;
		where.innerHTML = ' '+where.innerHTML.replace(new RegExp('[^a-zа-яё_-]' + word + '[^a-zа-яё_-]', 'gim'), '<span class="wordSelected">' + ' ' + word + ' ' + '</span>');
		
	},
	deleted: function() {
		var elems = document.getElementsByClassName('wordSelected');
		for(var i=elems.length-1; i>=0; i--) elems[i].outerHTML = ' '+elems[i].innerHTML+' ';
	},
	focused: function() {
		var elems = document.getElementsByClassName('wordSelected');
		if(!elems[0]) return;
		if(elems[this.focusIndex]) elems[this.focusIndex].classList.remove('wordFocused');
		if(elems[++this.focusIndex]) elems[this.focusIndex].classList.add('wordFocused');
		else {
			this.focusIndex = -1;
			this.focused();
		}
	},
	focusIndex: -1
}
</script>
</body>
</html>
Ответить с цитированием