Javascript-форум - Перебор элементов и запись в переменную

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Перебор элементов и запись в переменную (https://javascript.ru/forum/dom-window/70873-perebor-ehlementov-i-zapis-v-peremennuyu.html)

Перебор элементов и запись в переменную

Добрый день. Есть фрагмент html:

<tbody>
<tr><td class="data field-name">3</td><td class="data field-meta">33</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">2</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr></tbody>

Как получить текст из td с классом data, и записать в переменную, чтобы значение было вида 3:33,2:22
Количество tr не ограниченно. Спасибо.
Пока набросал такой код:

jQuery('tbody tr').each(function(i,elem) {
	var name_field = jQuery(this).children('td').eq(0).text();
	var meta_field = jQuery(this).children('td').eq(1).text();
	// здесь как-то записать значения в переменную fields
});
alert(fields);

$(function() {
    var s = $.map($('#tbl tr'), function(e) {
        var o = $(e).children();
        return o.eq(0).text() + ':' + o.eq(1).text()
    }).join(',');
    console.log(s)
});

Спасибо. А как пропустить td, если в нем есть класс, например active?

Цитата:

Сообщение от Янковиц

А как пропустить td

Что значит пропустить, он что может быть между двумя первыми нужными ячейками?

Да, td с классом activ в самом начале.

Ну если так:

<tr><td>Этот пропустить</td><td class="data field-name">3</td><td class="data field-meta">33</td>

то ничего не меняется, только конкретизировать надо каких детишек брать: var o = $(e).children('[class|=field]');

Просто, этот дополнительный элемент может присутствовать, а может и нет. Изменяются динамически.

Делайте так как написано, и не важно будет есть такая ячейка или нет.

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(function() {
    var s = $.map($('.data:even:not(.active)'), function(e) {
        return $(e).text() + ':' + $(e).next().text()
    }).join(',');
    console.log(s)
});
</script>

<table>
<tbody>
<tr><td class="data field-name">2</td><td class="data field-meta">33</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">3</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">4</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">5</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">6</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">7</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">8</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data active field-name">9</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">10</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">11</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">12</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
<tr><td class="data field-name">13</td><td class="data field-meta">22</td><td class="action"><span class="save">Save</span></td></tr>
</tbody>
<table>