โพสต์นี้ได้ระบุวิธีการค้นหารหัสวัตถุในอาร์เรย์ของวัตถุ JavaScript
วิธีการต่อท้าย () ใน JavaScript คืออะไร
“ ผนวก() ” วิธีการใน JavaScript ใช้สำหรับแทรกองค์ประกอบหรือวัตถุสตริงที่ส่วนท้ายขององค์ประกอบ นี่เป็นหนึ่งในวิธีที่มีประโยชน์ที่สุดในการเพิ่มองค์ประกอบที่ต้องการในตำแหน่งที่ระบุที่ส่วนท้ายขององค์ประกอบ
วิธีการใช้ append() วิธีการใน JavaScript?
หากต้องการใช้ฟังก์ชัน append() ใน JavaScript ให้ทำตามไวยากรณ์ที่ระบุด้านล่าง:
＄ ( ตัวเลือก ) . ผนวก ( เนื้อหา, ฟังก์ชั่น ( ดัชนี, html ) )
ที่นี่:
- “ ตัวเลือก ” เป็นองค์ประกอบ HTML ที่เข้าถึงได้
- “ ผนวก() ” วิธีการใช้เพื่อเพิ่มองค์ประกอบ
- “ เนื้อหา ” เป็นพารามิเตอร์ที่จำเป็น ซึ่งกำหนดเนื้อหาข้อมูลที่จะต่อท้าย
- “ การทำงาน() ” เป็นองค์ประกอบทางเลือก
ตัวอย่างที่ 1: ต่อท้ายองค์ประกอบเดียวกันในย่อหน้า
หากต้องการผนวกองค์ประกอบเดียวกันในย่อหน้า ขั้นแรก ให้เปิดหน้า HTML ที่เกี่ยวข้องและใช้ ' ” แท็กเพื่อฝังข้อมูลระหว่างแท็ก นอกจากนี้ กำหนด “ รหัส ” ไปยังย่อหน้าเพื่อเข้าถึงใน JavaScript:
< รหัสพี = 'องค์ประกอบ' > ยินดีต้อนรับสู่ลินุกซ์ชินท์ หน้า >
ถัดไป สร้างปุ่มด้วยความช่วยเหลือของ ' <ปุ่ม> ” องค์ประกอบและใช้ “ ระดับ ” แอตทริบิวต์เพื่อระบุชื่อเฉพาะและฝังข้อความด้วยองค์ประกอบปุ่มที่จะแสดงบนปุ่ม:
< ปุ่ม ระดับ = 'บีทีเอ็น' > ผนวกองค์ประกอบ ปุ่ม >ตอนนี้ ใช้ “ <สคริปต์> ” แท็กเพื่อเพิ่มรหัส JavaScript:
< สคริปต์ >
$ ( เอกสาร ) . พร้อม ( การทำงาน ( ) {
$ ( '.btn' ) . คลิก ( การทำงาน ( ) {
$ ( '#องค์ประกอบ' ) . ผนวก ( 'ต่อท้ายข้อความเมื่อคลิกปุ่ม' ) ;
} ) ;
} ) ;
สคริปต์ >
ตามรหัสที่กำหนด:
- “ พร้อม() วิธีการ ” ใช้สำหรับทำให้ฟังก์ชั่นพร้อมใช้งานเมื่อโหลดเอกสารบนหน้าจอสำเร็จ ในการทำเช่นนั้น ให้ผ่าน “ การทำงาน() ” วิธีการเป็นพารามิเตอร์
- “ คลิก() ” วิธีการเรียกใช้เมื่อผู้ใช้คลิกที่องค์ประกอบปุ่ม HTML วิธีการนี้กำหนดการดำเนินการของการคลิกเมื่อผู้ใช้กดปุ่ม
- “ ผนวก() ” วิธีการแทรกชุดของวัตถุหลังจากการดำเนินการของ “ คลิก() ' วิธี. เพื่อจุดประสงค์นั้น ให้ส่งข้อความที่ต้องการต่อท้าย
เอาต์พุต
ตัวอย่างที่ 2: ต่อท้ายองค์ประกอบต่างๆ ในแบบฟอร์มรายการ
คุณสามารถต่อท้ายองค์ประกอบต่าง ๆ ในรูปแบบของรายการ ในการดำเนินการดังกล่าว ให้สร้างหน้า HTML และฝังข้อความด้วยความช่วยเหลือของ ' แท็ก:
< รหัสพี = 'ผนวก' > JavaScript ต่อท้าย ( ) การทำงาน หน้า >สร้างปุ่มโดยใช้ปุ่ม “ <ปุ่ม> ” องค์ประกอบและใช้ “ เมื่อคลิก ” เหตุการณ์ที่เกิดขึ้นเมื่อผู้ใช้คลิกที่องค์ประกอบ HTML:
< ปุ่มบนคลิก = 'ฟังก์()' > ผนวกองค์ประกอบ ปุ่ม >สร้าง div container และกำหนด id ให้กับ container นั้นโดยใช้คำสั่ง “ รหัส ' คุณลักษณะ. ถัดไป เพิ่มองค์ประกอบด้วยความช่วยเหลือของ ' แท็ก:
< รหัส div = 'องค์ประกอบเพิ่มเติม' >< หน้า > องค์ประกอบ 1 หน้า >
< หน้า > องค์ประกอบ 2 หน้า >
แผนก >
ต่อไป ใช้ปุ่ม “ <สคริปต์> แท็ก ” และเพิ่มรหัสต่อไปนี้ระหว่างแท็ก:
< สคริปต์ >var ElementNumber = 3 ;
ฟังก์ชัน ฟังค์ชั่น ( ) {
เป็นผู้ปกครอง = เอกสาร. getElementById ( 'องค์ประกอบเพิ่มเติม' ) ;
เป็นองค์ประกอบใหม่ = '
องค์ประกอบ'
+ หมายเลของค์ประกอบ + '' ;พ่อแม่. แทรกAdjacentHTML ( 'ก่อนจบ' และองค์ประกอบ ) ;
หมายเลของค์ประกอบ ++;
}
สคริปต์ >
ในรหัสที่ระบุข้างต้น:
- ประกาศตัวแปรโดยใช้ปุ่ม “ เคยเป็น ” คำหลักและกำหนดค่าให้ตามความต้องการของคุณ
- กำหนดฟังก์ชันและเริ่มต้นตัวแปรอื่นภายในฟังก์ชันที่กำหนดด้วยชื่อเฉพาะ
- จากนั้นเรียกใช้ ' getElementById() วิธีการ JavaScript เพื่อเข้าถึงองค์ประกอบและส่งค่ารหัสเป็นพารามิเตอร์
- “ แทรกAdjacentHTML() ” วิธีการใช้สำหรับเพิ่มรหัส HTML ในตำแหน่งที่ระบุและเพิ่มองค์ประกอบที่อยู่ติดกัน
- ใช้ตัวดำเนินการเพิ่มเพื่อเพิ่มองค์ประกอบ:
คุณได้เรียนรู้เกี่ยวกับการใช้เมธอด append() ใน JavaScript พร้อมตัวอย่างต่างๆ
บทสรุป
“ ผนวก() ” เป็นวิธี JavaScript ที่ใช้สำหรับการแทรกองค์ประกอบและวัตถุที่ส่วนท้ายขององค์ประกอบที่กำหนด คุณสามารถผนวกองค์ประกอบเดียวกันและองค์ประกอบที่แตกต่างกันในรูปแบบของย่อหน้าและรายการ โดยเฉพาะอย่างยิ่งสามารถเรียกใช้ได้ด้วยการคลิกปุ่ม โพสต์นี้ได้สาธิตวิธีการผนวก () ใน JavaScript