Dilettante_Pro,
зачем дважды искать одно и тоже |
рони, вот так симпатичней
document.getElementsByTagName('button')[0].addEventListener('click', e=>
document.querySelectorAll('.td1').forEach(el=> el.closest('table').remove()));
|
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
table
{
border-collapse: collapse;
}
td
{
height: 20px;
width: 20px;
border: solid black 1px;
}
.td1
{
height: 20px;
width: 60px;
border: solid black 1px;
background-color: #FF0000;
}
</style>
</head>
<body>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">1</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">2</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">3</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">4</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">5</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">6</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td class = "td1">7</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr>
<td></td><td></td><td></td>
</tr>
</tbody>
</table>
<button>Click</button>
<script>
document.getElementsByTagName('button')[0].addEventListener('click', gggg);
function gggg()
{
let a = document.querySelectorAll('.td1');
let x = a.length;
for (let i = 0; i < x; i++)
{
a[i].parentNode.parentNode.parentNode.remove();
}
}
</script>
</body>
</html>
|
Цитата:
|
j0hnik,
Dilettante_Pro, :dance: :lol: :victory: |
j0hnik,
Dilettante_Pro, рони, Спасибо большое! Да, моя ошибка в том, что коллекция меняется. Я то думал, что при удалении элемента, он сам из DOM исчезает, но ссылка на него и он сам присутствует. Вот здесь об это идёт речь: https://developer.mozilla.org/ru/doc...ildNode/remove |
atanov,
В этом примере Цитата:
var elem = document.querySelector("#one");
elem.remove();
alert(document.querySelector("#box").innerHTML); //Исчез блок #one
alert(elem); //Но как видите, сам объект еще жив
используется document.querySelector, который создает ссылку на найденный элемент. Эта ссылка - переменная elem - существует независимо от того, удален сам элемент или нет. Если после удаления ее "освежить":
elem = document.querySelector("#one");
- то она станет nullВы же использовали document.getElementsByClassName(), который создает "живую" коллекцию элементов, которая переформировывается при удалении определенных элементов из коллекции. К тому же вы еще и самостоятельно при каждом удалении перечитывали коллекцию. |
| Часовой пояс GMT +3, время: 02:26. |