เมธอด append
เมธอด append เพิ่มข้อความที่ส่วนท้าย
ขององค์ประกอบ นอกจากนี้ยังมีเมธอด
appendTo,
ซึ่งทำงานในลักษณะเดียวกัน
ไวยากรณ์
แทรกข้อความที่ส่วนท้ายขององค์ประกอบ:
$(ตัวเลือก).append(ข้อความ);
ที่ส่วนท้ายขององค์ประกอบที่เลือก สามารถเพิ่ม ข้อความ ซึ่งจะถูกส่งคืนจากฟังก์ชันที่ผู้ใช้กำหนด ฟังก์ชันจะถูกเรียกแยกกันสำหรับ แต่ละองค์ประกอบที่เลือก เมื่อเรียกใช้ จะส่งพารามิเตอร์ต่อไปนี้ให้กับฟังก์ชัน: ตำแหน่ง ขององค์ประกอบในชุด, เนื้อหาปัจจุบันขององค์ประกอบ:
$(ตัวเลือก).append(function(หมายเลขในชุด, เนื้อหาปัจจุบันขององค์ประกอบ));
เนื้อหายังสามารถเป็นได้ไม่เพียงแค่ข้อความธรรมดา แต่ยังเป็นองค์ประกอบ DOM หรือออบเจกต์ jQuery ได้อีกด้วย ในกรณีนี้ องค์ประกอบเหล่านี้ จะถูกย้ายจากตำแหน่งเดิมในโค้ด HTML
ตัวอย่าง
ลองเพิ่มข้อความที่ส่วนท้ายของย่อหน้าที่กำหนด:
<p id="test">ข้อความ</p>
$('#test').append('!!!');
โค้ด HTML จะกลายเป็นดังนี้:
<p id="test">ข้อความ!!!</p>
ตัวอย่าง
ลองเพิ่มข้อความพร้อมแท็กที่ส่วนท้ายของย่อหน้าที่กำหนด:
<p id="test">ข้อความ</p>
$('#test').append('<b>!!!</b>');
โค้ด HTML จะกลายเป็นดังนี้:
<p id="test">ข้อความ<b>!!!</b></p>
ตัวอย่าง
ลองค้นหาย่อหน้าทั้งหมด และที่ส่วนท้ายของแต่ละ ย่อหน้า ให้ใส่หมายเลขลำดับในชุด:
<p>ข้อความ</p>
<p>ข้อความ</p>
<p>ข้อความ</p>
<p>ข้อความ</p>
<p>ข้อความ</p>
$('p').append(function(index, text){return index;});
โค้ด HTML จะกลายเป็นดังนี้:
<p>ข้อความ0</p>
<p>ข้อความ1</p>
<p>ข้อความ2</p>
<p>ข้อความ3</p>
<p>ข้อความ4</p>
