Блог

В моем коде я делаю что-то с таблицей на основе щелчка по столбцу или строке. Я видел только способ получения таблицы с помощью parentElement

Так что я мог бы

 <div id="table-container">

</div>
  

 let table = document.createElement('table');
table.id = 'my-table';


let thead = table.createTHead();
let thead_row = thead.insertRow();
let thead_cell = thead_row.insertCell();
thead_cell.textContent = "Products";

let tbody = table.createTBody();
let tbody_row1 = thead.insertRow();
let tbody_cell1 = tbody_row1.insertCell();
tbody_cell1.textContent = "apple";
let tbody_row2 = thead.insertRow();
let tbody_cell2 = tbody_row1.insertCell();
tbody_cell1.textContent = "orange";

document.getElementById('table-container').appendChild(table);
  

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

Итак, допустим, я поместил eventlistener в строку следующим образом:

 tbody_row2.addEventListener('click', function() {
    alert(tbody_row2.parentElement.parentElement.id);
})
  

чтобы получить идентификатор таблицы из самой строки (если у меня не было простой ссылки на таблицу), мне нужно использовать
[element].parentElement.parentElement.id
что для меня не всегда понятно, это таблица.

Чтобы получить строки из таблицы, я могу написать.

 table.rows;
  

Есть ли что-нибудь похожее на:

 row.table;
  

для восходящей ссылки?

Вы могли бы использовать метод .closest элемента: https://developer.mozilla.org/en-US/docs/Web/API/Element/closest

Если у вас есть элемент строки, вы можете запустить эту команду для этого элемента строки, и она вернет первый родительский элемент с переданным вами селектором

 const row = table.rows[0];
const parentTable = row.closest('table');