|
|
04.11.2019, 12:41
|
|
Профессор
|
|
Регистрация: 20.10.2016
Сообщений: 223
|
|
|
Перебор столбцов таблицы
Здравствуйте!
Подскажите, пожалуйста, как сделать чтоб цикл проходил по всем столбцам таблицы?
Вот так только по первому столбцу проходит:
var tch = document.querySelectorAll(".MyTab tbody tr");
[].forEach.call(tch, function(tr) {
alert(tr.cells[0].textContent);
});
|
|
04.11.2019, 12:50
|
 |
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,155
|
|
DDim1000,
логично же просто добавить перед alert, forEach по tr.cells. 
|
|
04.11.2019, 13:22
|
|
Профессор
|
|
Регистрация: 20.10.2016
Сообщений: 223
|
|
Сообщение от рони
|
DDim1000,
логично же просто добавить перед alert, forEach по tr.cells.
|
А не получится ли так, что цикл по 10 раз будет проходить по таблице?
var tch = document.querySelectorAll(".MyTab tbody tr");
[].forEach.call(tch, function(tr) {
[].forEach.cell(tch, function(tr) {
alert(tr.cells[0].textContent);// что здесь выведется?
});
});
|
|
04.11.2019, 13:29
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,155
|
|
|
обход ячеек таблицы слева на право
DDim1000,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<table width="400" class="MyTab" >
<thead>
<tr>
<th>Title 1</th>
<th>Title 2</th>
<th>Title 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell 1.1</td>
<td>Cell 1.2</td>
<td>Cell 1.3</td>
</tr>
<tr>
<td>Cell 2.1</td>
<td>Cell 2.2</td>
<td>Cell 2.3</td>
</tr>
</tbody>
</table>
<script>
var tch = document.querySelectorAll(".MyTab tbody tr");
tch.forEach(function(tr) {
tr.querySelectorAll('td').forEach(function(td) {
alert(td.textContent)
});
});
</script>
</body>
</html>
Последний раз редактировалось рони, 04.11.2019 в 13:35.
|
|
04.11.2019, 13:34
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,155
|
|
|
обход ячеек таблицы сверху на вниз
DDim1000,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<table width="400" class="MyTab" >
<thead>
<tr>
<th>Title 1</th>
<th>Title 2</th>
<th>Title 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>Cell 1.1</td>
<td>Cell 1.2</td>
<td>Cell 1.3</td>
</tr>
<tr>
<td>Cell 2.1</td>
<td>Cell 2.2</td>
<td>Cell 2.3</td>
</tr>
</tbody>
</table>
<script>
var tch = document.querySelectorAll(".MyTab tbody tr");
tch[0].querySelectorAll('td').forEach(function(_, i) {
tch.forEach(function(tr) {
alert(tr.cells[i].textContent)
});
});
</script>
</body>
</html>
|
|
04.11.2019, 15:49
|
|
Профессор
|
|
Регистрация: 20.10.2016
Сообщений: 223
|
|
А если таблиц несколько? Как можно обойти каждую таблицу по очереди? Ячеек в строке: 15
<div class="dat" align="left" style="border: 1px solid #000">
<table width="400" class="MyTab">
<thead>
……
</thead>
<tbody>
<tr>
<td>Таблица 1. Ячейка 1</td>
<td>Таблица 1. Ячейка 2</td><td>Таблица 1. Ячейка 3</td>
<td>Таблица 1. Ячейка 4</td>
</tr>
<tr>
<td>Таблица 1. Ячейка 5</td>
<td>Таблица 1. Ячейка 6</td>
<td>Таблица 1. Ячейка 7</td>
<td >Таблица 1. Ячейка 8</td>
</tr>
</tbody>
</table>
</div>
<div class="dat" align="right" style="border: 1px solid #000">
<table width="400" class="MyTab">
<thead>
……
</thead>
<tbody>
<tr>
<td>Таблица 2. Ячейка 11</td>
<td>Таблица 2. Ячейка 2 </td><td>Таблица 2. Ячейка 3</td>
<td>Таблица 2. Ячейка 4</td>
</tr>
<tr>
<td>Таблица 2. Ячейка 5</td>
<td>Таблица 2. Ячейка 6</td>
<td>Таблица 2. Ячейка 7</td>
<td >Таблица 2. Ячейка 8</td>
</tr>
</tbody>
</table>
</div>
|
|
04.11.2019, 15:58
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,155
|
|
|
Сообщение от DDim1000
|
|
Как можно обойти каждую таблицу по очереди?
|
алгоритм тотже первый цикл по таблицам!!! |
|
04.11.2019, 16:04
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,155
|
|
DDim1000,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class="dat" align="left" style="border: 1px solid #000">
<table width="400" class="MyTab">
<thead>
……
</thead>
<tbody>
<tr>
<td>Таблица 1. Ячейка 1</td>
<td>Таблица 1. Ячейка 2</td><td>Таблица 1. Ячейка 3</td>
<td>Таблица 1. Ячейка 4</td>
</tr>
<tr>
<td>Таблица 1. Ячейка 5</td>
<td>Таблица 1. Ячейка 6</td>
<td>Таблица 1. Ячейка 7</td>
<td >Таблица 1. Ячейка 8</td>
</tr>
</tbody>
</table>
</div>
<div class="dat" align="right" style="border: 1px solid #000">
<table width="400" class="MyTab">
<thead>
……
</thead>
<tbody>
<tr>
<td>Таблица 2. Ячейка 11</td>
<td>Таблица 2. Ячейка 2 </td><td>Таблица 2. Ячейка 3</td>
<td>Таблица 2. Ячейка 4</td>
</tr>
<tr>
<td>Таблица 2. Ячейка 5</td>
<td>Таблица 2. Ячейка 6</td>
<td>Таблица 2. Ячейка 7</td>
<td >Таблица 2. Ячейка 8</td>
</tr>
</tbody>
</table>
</div>
<script>
var tablesTbody = document.querySelectorAll('.MyTab tbody');
tablesTbody.forEach(function(tbody) {
var trs = tbody.querySelectorAll('tr');
trs[0].querySelectorAll('td').forEach(function(_, i) {
trs.forEach(function(tr) {
alert(tr.cells[i].textContent)
});
});
});
</script>
</body>
</html>
|
|
04.11.2019, 16:13
|
|
Профессор
|
|
Регистрация: 20.10.2016
Сообщений: 223
|
|
|
Сообщение от рони
|
|
алгоритм тотже первый цикл по таблицам!!!
|
Сейчас выводятся сначала все первые столбцы, из всех таблиц, потом вторые, третьи и т.д., и цикл заканчивается не успевая пройти все столбцы таблицы.
var tch = document.querySelectorAll(".MyTab tbody tr");
tch[0].querySelectorAll('td').forEach(function(_, i) {
tch.forEach(function(tr) {
alert(tr.cells[i].textContent)
});
});
|
|
04.11.2019, 16:37
|
|
Профессор
|
|
Регистрация: 20.10.2016
Сообщений: 223
|
|
|
Все, разобрался. Спасибо!!!!!!!!
|
|
|
|
