Ändra Innehåll

Praktiska Steg:

1. Identifiera elementet att ändra: Använd document.getElementById() eller document.querySelector() för att välja elementet.
2. Ändra innehåll med innerHTML: Ersätter allt innehåll inom elementet med nytt HTML.
3. Ändra textinnehåll med textContent: Ersätter endast textinnehållet inom elementet.
4. Ändra textinnehåll med innerText: Liknande textContent, men fungerar inte i alla webbläsare.
5. Skapa nytt element med createElement: Skapar ett nytt HTML-element.
6. Lägg till element med appendChild: Lägger till ett nytt element längst ner i ett befintligt element.
7. Ta bort element med removeChild: Tar bort ett befintligt element från sin förälder.
8. Infoga element med insertBefore: Infogar ett nytt element före ett befintligt element.

Exempel i Javascript:

// Hämtar elementet med id "demo"
const demo = document.getElementById("demo");

// Ändrar texten med innerHTML
demo.innerHTML = "<strong>Ny text med innerHTML</strong>";

// Ändrar texten med textContent
demo.textContent = "Ny text med textContent";

// Skapar ett nytt element
const nyttElement = document.createElement("p");

// Lägger till nytt element som sista barn
demo.appendChild(nyttElement);

// Tar bort det sista barnet
demo.removeChild(demo.lastChild);

// Infogar ett nytt element före det första barnet
demo.insertBefore(nyttElement, demo.firstChild);