Простой javascript подсчет строк таблицы

#javascript

#javascript

Вопрос:

Я новичок в веб-разработке, и я хочу подсчитать все строки в таблице. У меня есть очень простой код

 <form>
  <input type="button" value="Count Table Rows" onclick="alert(document.getElementById('tableId').rows.length);">
</form>
  

Это отобразит целое число, если я нажму какую-либо кнопку. Но я хочу, чтобы он просто отображался в div когда пользователь обращается к этой странице или во время загрузки страницы, он автоматически отображает цифры.

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

1. Вы хотите использовать onload функцию вместо onclick .

2. Можете ли вы опубликовать код для строк таблицы?

3. window.onload = function() { alert(document.getElementById('tableId').rows.length) } ?

4. window.onload = function() { document.getElementById("divID").innerHTML = document.getElementById("tableId").rows.length };

5. Добавьте обработчик событий загрузки для страницы, получите количество строк с помощью вашего кода и получите div и отображение .

Ответ №1:

Вы можете добавить прослушиватель событий к объекту window или просто добавить код в теги script в конце страницы.

 <script>
// self executing function
(function() {
    var div = document.getElementById('dividhere');
    div.innerHTML = "Table Row Count : "   document.getElementById('tableId').rows.length;
})();
</script>
  

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

1. Помимо использования самоисполняющейся функции, я рекомендую просто использовать onload функцию JavaScript. (function() { -> window.onload = function() { .

Ответ №2:

 <div>
  <script>
    document.write(document.getElementById('tableid').rows.length)
  </script>
</div>
  

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

1. Не используйте document.write .

2. window.onload = function() { document.getElementById(«divID»).innerHTML = document.getElementById(«tableId»).rows.length } Работает для меня, как предложил @Jason. Но я забыл упомянуть в своем вопросе, что у меня есть 5 таблиц в моем html, и каждая из них имеет разное количество строк. Хорошая ли идея иметь javascript в каждой таблице для подсчета строк каждой таблицы и использовать приведенный выше скрипт для каждой из них?