jQuery - Inhoud en attributen ophalen
jQuery bevat krachtige methoden voor het wijzigen en manipuleren van HTML-elementen en attributen.
jQuery DOM-manipulatie
Een heel belangrijk onderdeel van jQuery is de mogelijkheid om de DOM te manipuleren.
jQuery wordt geleverd met een aantal DOM-gerelateerde methoden die het gemakkelijk maken om elementen en attributen te openen en te manipuleren.
DOM = Document Object Model
De DOM definieert een standaard voor toegang tot HTML- en XML
-documenten: "Het W3C Document Object Model (DOM) is een platform- en taalneutrale interface waarmee programma's en scripts dynamisch toegang hebben tot de inhoud, structuur en stijl van een document."
Inhoud ophalen - text(), html() en val()
Drie eenvoudige, maar nuttige jQuery-methoden voor DOM-manipulatie zijn:
text()- Stelt de tekstinhoud van geselecteerde elementen in of retourneert dezehtml()- Stelt of retourneert de inhoud van geselecteerde elementen (inclusief HTML-opmaak)val()- Stelt de waarde van formuliervelden in of retourneert deze
Het volgende voorbeeld laat zien hoe u inhoud kunt krijgen met de jQuery text()en html()methoden:
Voorbeeld
$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});
Het volgende voorbeeld laat zien hoe u de waarde van een invoerveld kunt krijgen met de jQuery- val()methode:
Voorbeeld
$("#btn1").click(function(){
alert("Value: " + $("#test").val());
});
Attributen ophalen - attr()
De jQuery- attr()methode wordt gebruikt om attribuutwaarden te krijgen.
Het volgende voorbeeld laat zien hoe u de waarde van het href-kenmerk in een link kunt krijgen:
Voorbeeld
$("button").click(function(){
alert($("#w3s").attr("href"));
});
In het volgende hoofdstuk wordt uitgelegd hoe u inhoud en attribuutwaarden kunt instellen (wijzigen).
jQuery-oefeningen
jQuery HTML-referentie
Ga voor een compleet overzicht van alle jQuery HTML-methoden naar onze jQuery HTML/CSS Reference .