Пожалуйста, помогите мне с этим простым сценарием

#javascript #for-loop #getelementsbytagname

#javascript #для цикла #getelementsbytagname

Вопрос:

Я новичок в JavaScript и хотел бы попросить помощи с моим простым скриптом.

То, что я пытаюсь сделать, это получить и отобразить значения всех элементов элемента списка в неупорядоченном списке с помощью цикла (for). Я смог заставить скрипт отображать все элементы списка в окне оповещения один за другим. Но проблема в том, что мне нужны значения всех элементов списка, отображаемые в виде строки таблицы. Вот так:

Понедельник
Вторник
Среда
…….

Вот что у меня есть в моем скрипте:

 <script language="JavaScript">
<!--
    function process() {
        a = document.getElementsByTagName('li')

        for (i = 0; i < a.length; i  ) {
            alert(a[i].childNodes[0].nodeValue);
        }
    }
//-->
</script>
  

И вот HTML-код:

 <body>
    <ul>
        <li>Monday</li>
        <li>Tuesday</li>
        <li>Wednesday</li>
    </ul>

    <input type="button" value="Submit" onclick="process()" />
</body>
  

Если это вообще возможно, кто-нибудь, пожалуйста, объясните, где я ошибаюсь в своем скрипте? Почему все 3 значения элемента списка не могут быть показаны в окне оповещения одновременно?

Большое спасибо!

Комментарии:

1. Я не могу помочь без примера кода.

2. Вы хотите, чтобы строка таблицы пересекалась или столбец, как в вашем списке? Что он анализирует прямо сейчас?

3. @Kris вопрос был неправильно отформатирован; код теперь виден.

4. Сохраните результат объединения через цикл всех значений в одном VAR, затем за пределами «цикла for» запишите содержимое VAR, там будет весь ваш неупорядоченный список.

Ответ №1:

Сначала создайте строковую переменную: var all_at_once = "" . Затем добавьте содержимое nodeValue . Наконец, предупредите эту переменную:

 function process(){
    var a = document.getElementsByTagName('li')
    var all_at_once = "";
    for(i=0;i<a.length;i  ){
        all_at_once  = a[i].childNodes[0].nodeValue   " ";
    }
    alert(all_at_once);
}
  

Ответ №2:

alert Показывается неоднократно, потому что это то, что for делает цикл… это цикл! Цикл будет перебирать массив элементов, возвращаемых getElementsByTagName , выполняя тело цикла один раз для каждого элемента в этом массиве.

Если вы хотите отобразить одно предупреждение, одним из вариантов было бы создать строку, содержащую соответствующий текст, а alert затем:

 var yourString = "";
for(i=0;i<a.length;i  ){
    yourString  = a[i].childNodes[0].nodeValue;
}
alert(yourString);
  

Некоторые другие замечания по вашему коду… вы должны почти всегда объявлять переменные с var ключевым словом, чтобы предотвратить их утечку в глобальную область видимости. Вы также должны всегда заканчивать строки точкой с запятой:

 function process(){
    var a = document.getElementsByTagName('li'),
        yourString = "";
    for(i=0;i<a.length;i  ){
        yourString  = a[i].childNodes[0].nodeValue;
    }
    alert(yourString);
}
  

Комментарии:

1. Все ваши ответы фантастические! Большое спасибо за помощь в решении этой проблемы! Я собирался выдвинуть идею изучения javascript дольше 🙂 Я попробую еще раз, еще раз спасибо!

Ответ №3:

 <script language="JavaScript">
<!--

    function process(){
        var data = '';
        a=document.getElementsByTagName('li')

            for(i=0;i<a.length;i  ){

                    data = data    'n'  (a[i].childNodes[0].nodeValue);
            }
         alert(data);
    }


//-->
</script>
  

Вам нужно вызвать оповещение только один раз, если вам нужно 1 всплывающее окно со всем текстом.

Ответ №4:

 function process()
{
  var a = getElementsByTagName('li'),
      text = '';

  for( i = 0; i < a.length; i   )
  {
    text  = a[i].childNodes[0].nodeValue   'n';
  }

  alert( text );
}
  

Ответ №5:

Вы можете обрабатывать дни любым удобным вам способом, сначала сохраняя их в массиве, а затем повторяя:

 var days = new Array();
var a = document.getElementsByTagName('li')
for(var i = 0; i < a.length; i  ) {
    days.push(a[i].childNodes[0].nodeValue);
}

for (i=0; i < days.length; i  ) {
    // process the day
}
  

Смотрите: http://jsfiddle.net/jkeyes/Cfg4k / для рабочего примера.

Ответ №6:

Эти несколько настроек вашей функции должны привести к желаемому результату. Удачи! Что изменилось: 1) Настройте пустую строку var 2) Вместо того, чтобы предупреждать каждое значение, просто добавьте их к строке var, которую вы создали ранее 3) Наконец, предупредите вновь созданную (объединенную) строку!

 function process() {
    a = document.getElementsByTagName('li');
    var days = new String("");

    for (i = 0; i < a.length; i  ) {
        days = days (a[i].childNodes[0].nodeValue) "n";
    }
    alert(days);
}
  

Теперь я вижу, что с момента открытия этой темы было множество ответов … но, возможно, все разные решения помогут вам по-разному.