jQuery - Stel inhoud en eienskappe
Stel inhoud - teks(), html() en val()
Ons sal dieselfde drie metodes van die vorige bladsy gebruik om inhoud op te stel :
text()- Stel of gee die teksinhoud van geselekteerde elemente terughtml()- 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 op te stel met die jQuery text(), html(), en val()metodes:
Voorbeeld
$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
$("#test3").val("Dolly Duck");
});
'n Terugbelfunksie vir teks(), html() en val()
Al die drie jQuery-metodes hierbo: text(), html(), en val(), kom ook met 'n terugbelfunksie. Die terugbelfunksie het twee parameters: die indeks van die huidige element in die lys van elemente wat gekies is en die oorspronklike (ou) waarde. Jy gee dan die string terug wat jy wil gebruik as die nuwe waarde van die funksie.
Die volgende voorbeeld demonstreer text()en html()met 'n terugbelfunksie:
Voorbeeld
$("#btn1").click(function(){
$("#test1").text(function(i, origText){
return "Old text: " + origText + " New text: Hello world!
(index: " + i + ")";
});
});
$("#btn2").click(function(){
$("#test2").html(function(i, origText){
return "Old html: " + origText + " New html: Hello
<b>world!</b>
(index: " + i + ")";
});
});
Stel eienskappe - attr()
Die jQuery attr()-metode word ook gebruik om kenmerkwaardes te stel/verander.
Die volgende voorbeeld demonstreer hoe om die waarde van die href-kenmerk in 'n skakel te verander (stel):
Voorbeeld
$("button").click(function(){
$("#w3s").attr("href", "https://www.w3schools.com/jquery/");
});
Die attr()metode laat jou ook toe om verskeie kenmerke op dieselfde tyd in te stel.
Die volgende voorbeeld demonstreer hoe om beide die href- en titelkenmerke op dieselfde tyd in te stel:
Voorbeeld
$("button").click(function(){
$("#w3s").attr({
"href" : "https://www.w3schools.com/jquery/",
"title" : "W3Schools jQuery Tutorial"
});
});
'n Terugbelfunksie vir attr()
Die jQuery-metode attr()kom ook met 'n terugbelfunksie. Die terugbelfunksie het twee parameters: die indeks van die huidige element in die lys van elemente wat gekies is en die oorspronklike (ou) kenmerkwaarde. Jy gee dan die string wat jy wil gebruik as die nuwe kenmerkwaarde van die funksie terug.
Die volgende voorbeeld demonstreer attr()met 'n terugbelfunksie:
Voorbeeld
$("button").click(function(){
$("#w3s").attr("href", function(i, origValue){
return origValue + "/jquery/";
});
});
jQuery Oefeninge
jQuery HTML-verwysing
Vir 'n volledige oorsig van alle jQuery HTML-metodes, gaan asseblief na ons jQuery HTML/CSS-verwysing .