JS-DOM/traversal.js at master · AyahElsayed/JS-DOM · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
// const bookList = document.querySelector('#book-list');

// console.log('book list parent element:', bookList.parentElement.parentElement); // body
// console.log('book list parent node:', bookList.parentNode); // wrapper

// console.log('all node children:');
// Array.from(bookList.childNodes).forEach(function (node) {
//     console.log(node);
// });

// console.log('all element children:');
// Array.from(bookList.children).forEach(function (node) {
//     console.log(node);
// });

// const titles = bookList.querySelectorAll('.name');

// console.log('Book titles:');
// Array.from(titles).forEach(function (title) {
//     console.log(title.textContent);
// });

// ----------------

const bookList = document.querySelector('#book-list');

console.log('#book-list next sibling:', bookList.nextSibling);
console.log('#book-list next element sibling:', bookList.nextElementSibling);
console.log('#book-list previous sibling:', bookList.previousSibling);
console.log('#book-list previous element sibling:', bookList.previousElementSibling);

bookList.previousElementSibling.querySelector('p').innerHTML += '<br />Too cool for everyone else!';