Вход

Просмотр полной версии : Скрипт выделяющий слова в тексте. Что я делаю не так


Aleksey140569
13.02.2015, 00:11
Есть следующее задание: X
Найдите у себя на компьютере или в Интернете текст на 2000-4000 символов.
Вставьте данный текст на страницу.
Создайте текстовое поле, в которое пользователь будет вводить строку, которую будет нужно найти в тексте.
Напишите скрипт, который в тексте на странице будет выделять все совпадения тегом <b>.
Примечание: После ввода искомой строки в тексте на странице должны быть выделены тегом <b> все найденные совпадения со строкой, чтобы пользователь сразу видел, где найдена его строка. Для поиска используйте indexOf(), также потребуются циклы. Если совпадений нет, то через alert(): «Ничего не найдено!».

я написал следующий код:

<script type="text/javascript">

var text = "";
text = "Здесь очень длинный текст";
document.getElementById("text").innerHTML = text;

findWord()
{
var word = "";
var target = "";

word = myform.text.value

var target = word; // цель поиска

var pos = -1;

while ((pos = str.indexOf(target, pos+1)) != -1)
{
var text = text.replace(target, "<b>" + target + "</b>");
}
}
</script>

Но как его довести до ума нет ни одной идеи...

рони
13.02.2015, 00:42
Aleksey140569,
а где html?

Aleksey140569
16.02.2015, 22:50
Вот код<!DOCTYPE html>
<html>
<head>
<title>Lesson018</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<p id="text"></p>

<script type="text/javascript">

var text = "";
text = "Стучат по стыкам колеса, плещется в большом медном чайнике кипяток. В теплушке, под потолком, тускло светит аккумуляторная лампочка, на нарах, застеленных невиданной здесь пенкой, сидят и лежат спецназовцы. Кто дремлет, кто не торопясь курит и разговаривает, а дежурная смена находится у дверей при оружии и в полной боевой готовности. Полковник Бережной и генерал Бонч-Бруевич сидят у приоткрытого багрового зева буржуйки, и ведут свой неспешный разговор. Обсуждается извечный на Руси вопрос — кто виноват, и что делать. Сейчас разговор крутился вокруг первой половины ХХ века, ставшей для России воистину дорогой на Голгофу. Генерала интересовало то, как увести страну с этого пути, и какова при этом должна быть роль армии.";
document.getElementById("text").innerHTML = text;

function findWord()
{
var word = "";
var target = "";
var text2 = "";

word = myform.search.value

var len = word.length;

var target = word;

var pos = -1;


while((pos = text.indexOf(target, pos+1)) != -1)
{
var target2 = "";

target2 = text.splice(pos, len);
text2 = text.replace(target, "<b>" + target + "</b");
}
document.getElementById("text").innerHTML = text2;
}
</script>
<form name="myform">
<p>Введите слово: </p>
<input type="text" name="search" />
<input type="submit" value="Найти" onclick="findWord()" />
</form>

</body>
</html>

рони
16.02.2015, 23:12
Aleksey140569,
:-?

<!DOCTYPE html>
<html>
<head>
<title>Lesson018</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
b{
background: #FFCC33;
font-size: 48px;

}
</style>
</head>
<body>
<p id="text"></p>

<script type="text/javascript">

var text = "Стучат по стыкам колеса, плещется в большом медном чайнике кипяток. В теплушке, под потолком, тускло светит аккумуляторная лампочка, на нарах, застеленных невиданной здесь пенкой, сидят и лежат спецназовцы. Кто дремлет, кто не торопясь курит и разговаривает, а дежурная смена находится у дверей при оружии и в полной боевой готовности. Полковник Бережной и генерал Бонч-Бруевич сидят у приоткрытого багрового зева буржуйки, и ведут свой неспешный разговор. Обсуждается извечный на Руси вопрос — кто виноват, и что делать. Сейчас разговор крутился вокруг первой половины ХХ века, ставшей для России воистину дорогой на Голгофу. Генерала интересовало то, как увести страну с этого пути, и какова при этом должна быть роль армии.",
p = document.getElementById("text");
p.innerHTML = text;

function findWord()
{
var target = new RegExp('\('+myform.search.value+'\)', 'mig'),
text2 = text.replace(target, "<b>$1<\/b>");;
p.innerHTML = text2 == text || !myform.search.value ? (alert('Ничего не найдено!'), text) : text2 ;
myform.search.value = '';
return false
}
</script>
<form name="myform" onsubmit="return findWord()">
<p>Введите слово: </p>
<input type="text" name="search" value="кто"/>
<input type="submit" value="Найти" />
</form>

</body>
</html>

Aleksey140569
18.02.2015, 20:21
Рони, большое большое спасибо!

Alexey1985
23.05.2017, 12:16
Нет. К сожалению это не вариант. В целях обучения, нужно обязательно решить эту задачу с использованием метода indexOf();

рони
23.05.2017, 12:50
В целях обучения
18.02.2015
:blink:

рони
23.05.2017, 14:37
Alexey1985,
<!DOCTYPE html>
<html>
<head>
<title>Lesson018</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
b{
background: #FFCC33;
font-size: 48px;
border-radius:4px;

}
</style>

</head>
<body>
<p id="text"></p>

<script type="text/javascript">

var text = "Стучат по стыкам колеса, плещется в большом медном чайнике кипяток. В теплушке, под потолком, тускло светит аккумуляторная лампочка, на нарах, застеленных невиданной здесь пенкой, сидят и лежат спецназовцы. Кто дремлет, кто не торопясь курит и разговаривает, а дежурная смена находится у дверей при оружии и в полной боевой готовности. Полковник Бережной и генерал Бонч-Бруевич сидят у приоткрытого багрового зева буржуйки, и ведут свой неспешный разговор. Обсуждается извечный на Руси вопрос — кто виноват, и что делать. Сейчас разговор крутился вокруг первой половины ХХ века, ставшей для России воистину дорогой на Голгофу. Генерала интересовало то, как увести страну с этого пути, и какова при этом должна быть роль армии.";
var el = document.getElementById("text")
el.innerHTML = text;

function findWord(event)
{ event.preventDefault();
var word = myform.search.value;
var target = "<b>" + word + "</b>";
var text2 = text;
var len = word.length;
var lenTarget = target.length
var pos = -1;
while(word && (pos = text2.indexOf(word, pos+1)) != -1)
{
text2 = text2.slice(0, pos) + target + text2.slice(pos+len) ;
pos+=lenTarget;
}
el.innerHTML = text2;
}
</script>
<form name="myform">
<p>Введите слово: </p>
<input type="text" name="search" value="кто"/>
<input type="submit" value="Найти" onclick="findWord(event)" />
</form>

</body>
</html>