jQuery - Kry inhoud en eienskappe


jQuery bevat kragtige metodes om HTML-elemente en -kenmerke te verander en te manipuleer.


jQuery DOM-manipulasie

Een baie belangrike deel van jQuery is die moontlikheid om die DOM te manipuleer.

jQuery kom met 'n klomp DOM-verwante metodes wat dit maklik maak om toegang tot elemente en eienskappe te verkry en te manipuleer.

DOM = Document Object Model

Die DOM definieer 'n standaard vir toegang tot HTML- en XML-dokumente:

"Die W3C Document Object Model (DOM) is 'n platform en taal-neutrale koppelvlak wat programme en skrifte toelaat om dinamiese toegang tot die inhoud, struktuur, en styl van 'n dokument."


Kry inhoud - teks(), html() en val()

Drie eenvoudige, maar nuttige jQuery-metodes vir DOM-manipulasie is:

  • text()- Stel of gee die teksinhoud van geselekteerde elemente terug
  • html()- Stel of gee die inhoud van geselekteerde elemente terug (insluitend HTML-opmaak)
  • val()- Stel of gee die waarde van vormvelde terug

Die volgende voorbeeld demonstreer hoe om inhoud te kry met die jQuery text()en html()metodes:

Voorbeeld

$("#btn1").click(function(){
  alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
  alert("HTML: " + $("#test").html());
});

Die volgende voorbeeld demonstreer hoe om die waarde van 'n invoerveld met die jQuery val()-metode te kry:

Voorbeeld

$("#btn1").click(function(){
  alert("Value: " + $("#test").val());
});


Kry kenmerke - attr()

Die jQuery attr()-metode word gebruik om kenmerkwaardes te kry.

Die volgende voorbeeld demonstreer hoe om die waarde van die href-kenmerk in 'n skakel te kry:

Voorbeeld

$("button").click(function(){
  alert($("#w3s").attr("href"));
});

Die volgende hoofstuk verduidelik hoe om inhoud en kenmerkwaardes te stel (verander).


jQuery Oefeninge

Toets jouself met oefeninge

Oefening:

Gebruik 'n jQuery-metode om die teksinhoud van 'n <div>-element terug te gee.

$("div").();


jQuery HTML-verwysing

Vir 'n volledige oorsig van alle jQuery HTML-metodes, gaan asseblief na ons jQuery HTML/CSS-verwysing .