Page 115 - 6108
P. 115
Метод element.closest(css) повертає найближчий батьківський
елемент (або сам елемент), який відповідає заданому CSS-селектору або null,
якщо таких елементів взагалі немає.
<article>
<div id="div-01">Here is div-01
<div id="div-02">Here is div-02
<div id="div-03">Here is div-03</div>
</div>
</div>
</article>
let el = document.getElementById('div-03');
let r1 = el.closest("#div-02"); // поверне елемент <div> з
id="div-02"
let r2 = el.closest("div div"); //поверне сам елемент
let r3 = el.closest("article > div"); //поверне елемент <div>
з id="div-01"
let r4 = el.closest(":not(div)"); поверне елемент <article>
3.4.3 Визначення позиції елемента, перевірка на вкладеність
Метод node.contains(otherNode) дозволяє перевірити чи вузол
otherNode є нащадком node. Повертає true якщо otherNode є нащадком
node, або node == otherNode. В іншому випадку повертає false.
// функція перевіряє наявність node в документі
function isInPage(node) {
return (node === document.body) ? false :
document.body.contains(node);
}
Метод node.compareDocumentPosition(otherNode) порівнює
позицію поточного вузла node і іншого вузла otherNode. Значення, що
повертається – це бітова маска (табл. 3.1)
Таблиця 3.1 – Результат виконання методу
node.compareDocumentPosition(otherNode)
Імя Значення Примітка
Вузли в різних документах
DOCUMENT_POSITION_DISCONNECTED 1 (000001)
(або один відсутній)
otherNode слідує
DOCUMENT_POSITION_PRECEDING 2 (000010) перед node (в порядку обходу
документу)
node слідує
DOCUMENT_POSITION_FOLLOWING 4 (000100) перед otherNode (в порядку
обходу документу)
DOCUMENT_POSITION_CONTAINS 8 (001000) otherNode містить node
DOCUMENT_POSITION_CONTAINED_BY 16 (010000) node містить otherNode
DOCUMENT_POSITION_IMPLEMENTATION_ 32 (100000) Зарезервовано