Javascript поиск по странице
Думаю вы не раз пользовались стандпртным поиском по странице при помощи того же firefox по нажатии на кнопочку F3. Это очень удобно, когда знаеш что искать, но к сожалению не все пользователи знают о такой замечательной функции, а многим просто лень её искать.
В данной статье я хочу показать как сделать некоторое подобие данной функции, а именно подсветку текста на странице.
Итак метод заключается в следующем: мы, пользуясь функцией replace() заменяем введённое в поле для поиска слово на такое же только с определённым стилем
|
1
2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<script type="text/javascript">
function searchTextOnPage(inputId) { var obj = window.document.getElementById(inputId); var textToFind; if (obj) { textToFind = obj.value; } else { alert("Немогу найти текст = " + inputId); return; } if (textToFind == "") { alert("Вы ничего не ввели"); return; } document.body.innerHTML = document.body.innerHTML.replace(eval("/"+textToFind+"/g"),"<b style='color:yelow'>"+textToFind+"</b>"); var obj = window.document.getElementById(inputId); obj.value = textToFind; } </script> |
Теперь выведем поле для поиска в нужное нам место
|
1
|
<input type="text" id="text-to-find"> <input type="button" onclick="javascript: searchTextOnPage('text-to-find'); return false;"/>
|
Рекомендуем почитать
Комментарии
|
