วิธี after
วิธี after เพิ่มข้อความหลัง
องค์ประกอบที่กำหนด นอกจากนี้ยังมีวิธี
insertAfter,
ซึ่งทำงานในลักษณะเดียวกัน
ไวยากรณ์
แทรกข้อความหลังองค์ประกอบ:
$(ตัวเลือก).after(ข้อความ);
ด้วยวิธีนี้ข้อความที่จะถูกส่งคืนโดยฟังก์ชันที่ผู้ใช้กำหนด จะถูกเพิ่มหลังจากองค์ประกอบที่เลือก ฟังก์ชันถูกเรียกแยกกันสำหรับ แต่ละองค์ประกอบที่เลือก ในพารามิเตอร์แรก ของฟังก์ชันนี้จะได้รับหมายเลขลำดับในชุดของแต่ละ องค์ประกอบที่เลือก (ตามลำดับ) ส่วน พารามิเตอร์ที่สองคือเนื้อหาปัจจุบันขององค์ประกอบ:
$(ตัวเลือก).after(function(หมายเลขในชุด, เนื้อหาปัจจุบันขององค์ประกอบ));
ข้อความอาจไม่ใช่เพียงข้อความธรรมดา แต่ยังเป็นองค์ประกอบ DOM หรือวัตถุ jQuery ได้ด้วย ในกรณีนี้องค์ประกอบเหล่านี้จะถูกย้าย จากตำแหน่งเดิมในโค้ด HTML
ตัวอย่าง
มาเพิ่มข้อความหลังย่อหน้าที่กำหนดกัน:
<p id="test">text</p>
$('#test').after('!!!');
โค้ด HTML จะมีลักษณะดังนี้:
<p id="test">text</p>!!!
ตัวอย่าง
มาเพิ่มข้อความพร้อมแท็กหลังย่อหน้าที่กำหนด กัน:
<p id="test">text</p>
$('#test').after('<p>!!!</p>');
โค้ด HTML จะมีลักษณะดังนี้:
<p id="test">text</p><p>!!!</p>
ตัวอย่าง
มาย้ายย่อหน้าหนึ่งไปไว้ใต้อีกย่อหน้ากัน (นั่นคือตัดย่อหน้าออกจากตำแหน่งเดิมและ วางในตำแหน่งใหม่):
<p id="p1">text1</p>
<p id="p2">text2</p>
$('#p1').after('#p2');
โค้ด HTML จะมีลักษณะดังนี้:
<p id="p2">text2</p>
<p id="p1">text1</p>
ดูเพิ่มเติม
-
วิธี
insertAfter,
ซึ่งเพิ่มข้อความหลังองค์ประกอบที่กำหนด -
วิธี
before,append,prepend,
ซึ่งช่วยให้เพิ่มเนื้อหาในตำแหน่งที่กำหนด บนหน้าได้ -
วิธี
clone,
ซึ่งสร้างสำเนาขององค์ประกอบที่เลือก
