Tilføjelse af Elementer til DOM'en Dynamisk
Manipulation af DOM involverer ofte dynamisk oprettelse og tilføjelse af nye elementer til dokumentet eller fjernelse af eksisterende elementer baseret på brugerinteraktioner. Her vil vi se på, hvordan man opretter og tilføjer elementer dynamisk.
Oprettelse af nye elementer og tilføjelse til DOM
JavaScript stiller metoder som createElement(), appendChild() og insertBefore() til rådighed for at oprette nye elementer og tilføje dem til DOM.
CreateElement()
Metoden createElement() opretter et nyt HTML-element, men tilføjer det ikke til DOM, før du eksplicit gør det med metoder som appendChild() eller insertBefore().
// JS:
const newDiv = document.createElement('div'); // Creates a new `<div>` element
newDiv.textContent = 'This is a new div';
AppendChild()
Metoden appendChild() tilføjer et nyt underordnet element til slutningen af en overordnet elements liste over underordnede. Den bruges ofte til at tilføje elementer nederst i en sektion, liste eller container.
index.html
index.js
InsertBefore()
Metoden insertBefore() indsætter et nyt element før et angivet eksisterende underordnet element, hvilket muliggør mere præcis placering inden for en overordnet.
index.html
index.js
1. Hvad gør metoden createElement()?
2. Hvad gør følgende kode?
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
Awesome!
Completion rate improved to 2.22Tilføjelse af Elementer til DOM'en Dynamisk
Stryg for at vise menuen
Manipulation af DOM involverer ofte dynamisk oprettelse og tilføjelse af nye elementer til dokumentet eller fjernelse af eksisterende elementer baseret på brugerinteraktioner. Her vil vi se på, hvordan man opretter og tilføjer elementer dynamisk.
Oprettelse af nye elementer og tilføjelse til DOM
JavaScript stiller metoder som createElement(), appendChild() og insertBefore() til rådighed for at oprette nye elementer og tilføje dem til DOM.
CreateElement()
Metoden createElement() opretter et nyt HTML-element, men tilføjer det ikke til DOM, før du eksplicit gør det med metoder som appendChild() eller insertBefore().
// JS:
const newDiv = document.createElement('div'); // Creates a new `<div>` element
newDiv.textContent = 'This is a new div';
AppendChild()
Metoden appendChild() tilføjer et nyt underordnet element til slutningen af en overordnet elements liste over underordnede. Den bruges ofte til at tilføje elementer nederst i en sektion, liste eller container.
index.html
index.js
InsertBefore()
Metoden insertBefore() indsætter et nyt element før et angivet eksisterende underordnet element, hvilket muliggør mere præcis placering inden for en overordnet.
index.html
index.js
1. Hvad gør metoden createElement()?
2. Hvad gør følgende kode?
Tak for dine kommentarer!
