ชุดเนื้อหา - text(), html() และ val()
เราจะใช้วิธีการเดียวกันสามจากหน้าก่อนหน้านี้ในการตั้งค่าเนื้อหา:
- text() - ชุดหรือส่งคืนเนื้อหาข้อความขององค์ประกอบที่เลือก
- html() - ชุดหรือส่งคืนเนื้อหาขององค์ประกอบที่เลือก (รวมถึงมาร์กอัป HTML) เดอะ
- val() - ชุดหรือผลตอบแทนที่คุ้มค่าของเขตข้อมูลแบบฟอร์ม
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงวิธีการตั้งค่าเนื้อหากับ jQuery text(), html() และ val() วิธีการ:
ตัวอย่าง
$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
$("#btn2").click(function(){
$("#test2").html("<b>Hello world!</b>");
});
$("#btn3").click(function(){
$("#test3").val("Dolly Duck");
});
ลองตัวเอง» ฟังก์ชันการโทรกลับสำหรับ text(), html() และ val()
ทั้งสามวิธีข้างต้น jQuery: text(), html() และ val() นอกจากนี้ยังมาพร้อมกับฟังก์ชั่นการติดต่อกลับ ฟังก์ชั่นการโทรกลับมีสองพารามิเตอร์: ดัชนีขององค์ประกอบปัจจุบันในรายการขององค์ประกอบเลือกและเดิม (เดิม) ค่า แล้วคุณจะกลับสตริงที่คุณต้องการใช้เป็นค่าใหม่จากฟังก์ชั่น
ตัวอย่างต่อไปนี้แสดงให้เห็นถึง text() และ html() ที่มีฟังก์ชั่นโทรกลับ:
ตัวอย่าง
$("#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 + ")";
});
});
ลองตัวเอง» ตั้งค่าแอตทริบิวต์ - attr()
jQuery attr() วิธีการนี้ยังใช้ในการตั้ง / เปลี่ยนค่าแอตทริบิวต์
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงวิธีการเปลี่ยน (ชุด) ค่าของ href แอตทริบิวต์ในการเชื่อมโยง:
ตัวอย่าง
$("button").click(function(){
$("#w3s").attr("href", "http://www.w3ii.com/jquery");
});
ลองตัวเอง» attr() วิธีนี้ยังช่วยให้คุณสามารถตั้งค่าคุณสมบัติหลายอย่างในเวลาเดียวกัน
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงวิธีการตั้งค่าทั้ง href และชื่อแอตทริบิวต์ในเวลาเดียวกัน:
ตัวอย่าง
$("button").click(function(){
$("#w3s").attr({
"href" : "http://www.w3ii.com/jquery",
"title" : "w3ii jQuery Tutorial"
});
});
ลองตัวเอง» ฟังก์ชันการโทรกลับสำหรับ attr()
jQuery วิธี attr() นอกจากนี้ยังมาพร้อมกับฟังก์ชั่นการติดต่อกลับ ฟังก์ชั่นการโทรกลับมีสองพารามิเตอร์: ดัชนีขององค์ประกอบปัจจุบันในรายการขององค์ประกอบที่เลือกและเดิม (เดิม) ค่าแอตทริบิวต์ แล้วคุณจะกลับสตริงที่คุณต้องการที่จะใช้เป็นค่าแอตทริบิวต์ใหม่จากฟังก์ชั่น
ตัวอย่างต่อไปนี้แสดงให้เห็นถึง attr() ที่มีฟังก์ชั่นโทรกลับ:
ตัวอย่าง
$("button").click(function(){
$("#w3s").attr("href", function(i, origValue){
return origValue + "/jquery";
});
});
ลองตัวเอง» ทดสอบด้วยตัวเองด้วยการออกกำลังกาย!
การใช้สิทธิ 1 » ออกกำลังกาย 2 » ออกกำลังกาย 3 » 4 การออกกำลังกาย» ออกกำลังกาย 5 »
jQuery HTML อ้างอิง
สำหรับภาพรวมทั้งหมดของทุกวิธี HTML jQuery โปรดไปที่เรา jQuery HTML / CSS อ้างอิง