วิธี wrap
วิธี wrap ทำหน้าที่ห่อหุ้ม
องค์ประกอบด้วยแท็กที่กำหนด
ไวยากรณ์
พารามิเตอร์ของวิธีสามารถเป็นข้อความ (อาจมี แท็กประกอบ), องค์ประกอบ DOM หรืออ็อบเจ็กต์ jQuery:
.wrap(text or tag);
วิธีนี้จะห่อหุ้มองค์ประกอบที่เลือกด้วยเนื้อหา ซึ่งจะถูกส่งกลับมาจากฟังก์ชันที่ผู้ใช้กำหนด ฟังก์ชันจะถูกเรียกแยกกันสำหรับ แต่ละองค์ประกอบที่เลือก โดยรับ ตำแหน่งขององค์ประกอบในชุดเป็นพารามิเตอร์:
.wrap(function(หมายเลขในชุด));
ตัวอย่าง
ลองห่อหุ้มย่อหน้าทั้งหมดที่มีคลาส www ด้วยแท็ก
div:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap(document.createElement('div'));
โค้ด HTML จะกลายเป็นแบบนี้:
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
ตัวอย่าง
พารามิเตอร์ที่ส่งเข้าไปได้ไม่เพียงแค่ชื่อ แท็ก แต่ยังสามารถเป็นโครงสร้างต่อไปนี้ได้:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div></div>');
โค้ด HTML จะกลายเป็นแบบนี้:
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<div><p class="www">text</p></div>
<p>text</p>
ตัวอย่าง
ในแท็กเปิดสามารถเขียนแอตทริบิวต์ใดๆ ก็ได้
โดยการห่อหุ้มจะรวมแอตทริบิวต์เหล่านั้นด้วย
ลองห่อหุ้มย่อหน้าที่มีคลาส
www ด้วย div ที่มีคลาส zzz:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
$('.www').wrap('<div class="zzz"></div>');
โค้ด HTML จะกลายเป็นแบบนี้:
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<div class="zzz"><p class="www">text</p></div>
<p>text</p>
