как использовать for loop в javascript, jquery для определения количества строк в таблице?

#javascript #jquery #for-loop

#javascript #jquery #цикл for

Вопрос:

У меня есть таблица, и я хочу, чтобы с ней было выполнено некоторое действие с помощью цикла for в JavaScript. Итак, кто-нибудь может сказать мне, каким будет код для этого. что цикл for будет работать для всех строк таблицы. На самом деле мне нужно удалить класс из таблицы, а затем после этого я должен применить класс к определенной строке. В чем моя задача, я должен выделить выделенную строку без выделения. когда я выбираю любую строку, она выделяется, но когда я выбираю другую строку, она остается выделенной, и другая тоже. итак, я хочу удалить выбранный класс из всех строк таблицы, а затем применить выбранный класс к определенной строке. МОЙ КОД:

    <style type="text/css">
    .highlight
    {
        background-color: Red;
    }
    .selected
    {
        background-color: #ffdc87;
    }
</style>

<script type="text/javascript">
    function Select(obj) {
        if (obj.className != 'selected') {

            obj.className = 'selected';
            var tbl = document.getElementById("Repaddressorbbl")
            var firstRow = tbl.getElementsByTagName("TR")[0];
        }
        else {
            obj.className = 'prev_class';
            var tbl = document.getElementById("Repaddressorbbl")
            var firstRow = tbl.getElementsByTagName("TR")[0];
        }
    }

</script>
  

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

1. Вопрос не понятен. Что на самом деле вам нужно? Можете ли вы привести какой-нибудь неработоспособный фрагмент кода на jsfiddle. чистый или jsbin.com ?

2. Для вашего обновленного вопроса вам не нужен цикл for, вы можете сделать это с помощью одной строки jQuery. Как насчет того, чтобы показать свой существующий код, чтобы люди, пишущие ответы, могли вписаться в него?

Ответ №1:

jQuery имеет неявную итерацию, поэтому вам не нужно вручную перебирать выбранные строки

 // remove all "highlight" classes from all <tr> elements
$("#your-table tr").removeClass("highlight");

// highlight row 3
$("#your-table tr:eq(2)").addClass("highlight");

// highlight row that belongs to a specific <td>
$("#my-td").parents("tr").addClass("highlight")

// etc
  

После того, как вы удалили все highlight классы, вы должны быть в состоянии довольно легко повторно выделить тот <tr> , который вы хотите.

Если вам нужна дополнительная помощь, дайте мне знать 🙂

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

1. Что это за :eq(2) псевдокласс? Это что-то вроде nth-child?

2. @MoeSweet это совершенно верно. В этом примере это был бы третий <tr> элемент.

Ответ №2:

в jquery попробуйте:

  var aaa= $('#yourdivid tr:gt(0)');
 $.each(aaa, function(indx, item) {
           ////your code

            }
  

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

1. jQuery имеет неявную итерацию, поэтому вам не нужно выполнять итерации вручную для подобных задач.

2. @macek — этот ответ был опубликован до того, как вопрос был обновлен, чтобы сказать, зачем ему нужен цикл for.

3. @nnnnnn большое спасибо. ответ на вопрос — это сообщение перед редактированием вопроса.

Ответ №3:

В POJS вы можете использовать коллекцию строк таблицы для перебора всех строк:

 var rows = tableElement.rows;
for (var i=0, iLen=rows.length; i<iLen; i  ) {
  /* do something with rows[i] */
}
  

rows — это живой список узлов. В некоторых браузерах быстрее сначала преобразовать его в массив, потому что браузер не знает, был ли изменен список или нет, поэтому при каждом обращении к нему он обновляется.

Более современные браузеры достаточно умны, чтобы не делать этого, но независимо от того, является ли это проблемой только в больших таблицах или если производительность является проблемой.

В вашем коде:

 var firstRow = tbl.getElementsByTagName("TR")[0];
  

может быть:

 var firstRow = tbl.rows[0];