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