Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Скрипт выделяющий слова в тексте. Что я делаю не так (https://javascript.ru/forum/misc/53673-skript-vydelyayushhijj-slova-v-tekste-chto-ya-delayu-ne-tak.html)

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

Цитата:

Сообщение от Alexey1985
В целях обучения

Цитата:

Сообщение от Aleksey140569
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>


Часовой пояс GMT +3, время: 22:39.