Сейчас, чтобы найти нужного мне предка, я пишу elem.parentElement.parentElement.parentElement.parentElement.
1) А можно как-то поизящнее?
2) И другой вопрос: есть такая структура:
Как узнать id table (в данном случае это "some"), если известен input#myInput?
Спасибо!
Ответы
Ответ 1
let elem = document.getElementById("myInput");
let elemId = elem.closest('table').id; // table id = some...
По сути, через тот же closest() можно искать и родителя, тут в зависимости от ситуации
варианты рассматривать надо
Ответ 2
Есть метод closest, который помогает искать родителя по какому-то селектору.
В случае с вашей таблицей:
const input = document.getElementById('myInput');
const table = input.closest('#some');
if (table) {
console.log('Parent of input is: ', table);
}
Полезные ссылки
closest
Ответ 3
Closest не поддерживается IE, так что в дополнение к другим ответам - полифил:
if (!Element.prototype.closest) {
Element.prototype.closest = function(css) {
var node = this;
while (node) {
if (node.matches(css)) return node;
else node = node.parentElement;
}
return null;
};
}
Ответ 4
Если нужен именно n родительский элемент, то можно написать свою функцию:
const nParent = (node, n) => {
while (node) {
if (n-- <= 0) return node;
else node = node.parentElement;
}
return null;
}
const x6 = document.getElementById('x6');
console.log(nParent(x6,0));
console.log(nParent(x6,1));
console.log(nParent(x6,2));
console.log(nParent(x6,3));
console.log(nParent(x6,4));
console.log(nParent(x6,5));
console.log(nParent(x6,6));
console.log(nParent(x6,7));
console.log(nParent(x6,8));
Комментариев нет:
Отправить комментарий