ptorrel/JS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added tag26

Browse Source
This commit is contained in:
Philippe Torrel
2026-07-20 09:55:44 +02:00
parent d0d53a1b3d
commit 0a69891333
12 changed files with 404 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
03_dom/uebungen/u17_tasse-01001/index.html
View File

@@ -1,4 +1,4 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
@@ -105,6 +105,34 @@
// Capacity: 11 oz.
// Füge den Listenpunkt aber dieses Mal nicht am Ende der Liste ein, sondern vor dem Eintrag Materials: Ceramic.
const list = $('#product_specification');
const item5 = $$('#product_specification li')[4];
// const listItem5 = $('#product_specification li:nth-child(5)');
// const listItem5 = $('#product_specification').lastElementChild.previousElementSibling; // DOM Traversal
console.log(item5);
const newList = document.createElement('li');
newList.textContent = 'Capacity: 11 oz.';
list.insertBefore(newList, item5);
// ======================
const prodSpecEl = $('#product_specification');
const prodSpecLiEls = $$('#product_specification li');
// einzufügenden Listenpunkt erstellen
const liCapacity = document.createElement('li');
liCapacity.textContent = 'Capacity: 11 oz.';
// Nu suchen an welcher Stelle - also den listenpunkt mit dem text Materials: Ceramic
const refLi = prodSpecLiEls.find((el) => {
return el.textContent === 'Materials: Ceramic';
});
// und einfügen
prodSpecEl.insertBefore(liCapacity, refLi);
}
</script>
</body>