”, “

' และ '

” แท็กใช้ในรหัสด้านล่าง:

---

---

< แผนก >
< h1 > สวัสดีผู้ใช้ Linuxint < / h1 >
< ชั่วโมง2 > Linuxint เป็นสถานที่แห่งสวรรค์ < / ชั่วโมง2 >
< หน้า > แบบสอบถามที่เกี่ยวข้องกับภาษาโปรแกรม < / หน้า >
< / แผนก >
< ปุ่ม > ตัวลบสไตล์สำหรับ Div < / ปุ่ม >

หลังจากรันโค้ดด้านบนแล้ว หน้าเว็บจะมีลักษณะดังนี้:

ผลลัพธ์แสดงโครงสร้าง HTML ของ div และปุ่ม

ขั้นตอนที่ 2: เพิ่มสไตล์อินไลน์
ภายในแท็กเปิด div ใช้เครื่องหมาย “ สไตล์ แอตทริบิวต์ ” และใช้คุณสมบัติ CSS บางอย่างเพื่อทำให้องค์ประกอบโดดเด่นและน่าสนใจ:

< แผนก สไตล์ = '
สี:ม่วงแดงเข้ม;
สีพื้นหลัง: อะความารีนขนาดกลาง;
ขอบ: 20px;
ช่องว่างภายใน: 30px;' >
< h1 >สวัสดีผู้ใช้ Linuxhint< / h1 >
< ชั่วโมง2 >Linuxhint เป็นสถานที่แห่งสวรรค์< / ชั่วโมง2 >
< หน้า >แบบสอบถามที่เกี่ยวข้องกับภาษาโปรแกรม< / หน้า >
< / แผนก >
< br >
< ปุ่ม > สไตล์ ลบ สำหรับ Div< / ปุ่ม >

ผลลัพธ์ของโค้ดด้านบนคือ:

ผลลัพธ์ยืนยันว่าสไตล์อินไลน์ใช้กับองค์ประกอบ div เท่านั้น

ขั้นตอนที่ 3: ใช้ jQuery เพื่อลบ Inline CSS
หากต้องการลบแอตทริบิวต์สไตล์ ฟังก์ชันพาเรนต์จะเรียกใช้เมื่อปุ่ม ' เอกสาร ' เป็น ' พร้อม '. ในโค้ดด้านล่าง ฟังก์ชันภายในจะเรียกใช้เมื่อผู้ใช้คลิก ' ปุ่ม '. หลังจากนั้น ฟังก์ชันนี้จะเลือกองค์ประกอบ div ทั้งหมดที่อยู่ในหน้าและใช้ปุ่ม ' ลบ Attr() ' วิธี:

< สคริปต์ >
$ ( เอกสาร ) .พร้อม ( การทำงาน ( ) {
$ ( 'ปุ่ม' ) .คลิก ( การทำงาน ( ) {
$ ( 'ดิฟ' ) .removeAttr ( 'สไตล์' ) ;
} ) ;
} ) ;
< / สคริปต์ >

หลังจากเพิ่มโค้ด jQuery แล้ว หน้าเว็บจะทำงานดังนี้:

“gif” ด้านบนแสดงให้เห็นว่าสไตล์ที่ใช้บน div ถูกลบออกโดยคลิกที่ปุ่ม

วิธีที่ 2: ลบ Class CSS ออกจาก Div

วิธีที่สองในการจัดรูปแบบองค์ประกอบ HTML คือการกำหนด ' ระดับ '. จากนั้นเพิ่ม CSS ในส่วนของคลาสนั้นภายใน “ <สไตล์> ” แท็กหรือใน “แยกต่างหาก” ไฟล์ CSS '. สไตล์เหล่านี้สามารถลบออกได้โดยใช้ jQuery ทำตามขั้นตอนด้านล่าง:

ขั้นตอนที่ 1: กำหนดคลาสให้กับองค์ประกอบ Div
ในไฟล์ HTML กำหนดแอตทริบิวต์คลาสให้กับ '

' องค์ประกอบ. กำหนด id ของ “remover” ให้กับ “ <ปุ่ม> แท็ก:

< แผนก ระดับ = 'จัดแต่งทรงผม' >
< h1 >สวัสดีผู้ใช้ Linuxhint< / h1 >
< ชั่วโมง2 >Linuxhint เป็นสถานที่แห่งสวรรค์< / ชั่วโมง2 >
< หน้า >แบบสอบถามที่เกี่ยวข้องกับภาษาโปรแกรม< / หน้า >
< / แผนก >
< ปุ่ม รหัส = 'ลบ' > สไตล์ ลบ < / ปุ่ม >

จากนั้นไปที่ “ <สไตล์> ” แท็กและเลือกชื่อคลาส div “ จัดแต่งทรงผม ” และพิมพ์คุณสมบัติ CSS ที่ใช้กับองค์ประกอบ div:

< สไตล์ >
.จัดแต่งทรงผม {
สี :โกลเด้นร็อด;
พื้นหลัง- สี : ทะเลเขียว;
ขอบ: 20px;
ช่องว่างภายใน: 30px;
}
< / สไตล์ >

หลังจากรันโค้ดด้านบนแล้ว หน้าเว็บจะมีลักษณะดังนี้:

เอาต์พุตแสดงว่ามีการใช้สไตล์กับองค์ประกอบ div

ขั้นตอนที่ 2: เพิ่ม jQuery เพื่อลบ CSS Styling
ใน ' <สคริปต์> แท็กเพิ่มรหัส jQuery เช่นเดียวกับที่ระบุไว้ในวิธีการข้างต้น jQuery “ ลบคลาส () ” วิธีการลบ “ จัดแต่งทรงผม ” คลาสที่กำหนดด้วยองค์ประกอบ “div” เมื่อคลิกปุ่ม:

< สคริปต์ >
$ ( เอกสาร ) .พร้อม ( การทำงาน ( ) {
$ ( 'ปุ่ม' ) .คลิก ( การทำงาน ( ) {
$ ( 'ดิฟ' ) .removeClass ( 'จัดแต่งทรงผม' ) ;
} ) ;
} ) ;
< / สคริปต์ >

หลังจากเพิ่มโค้ดด้านบนแล้ว หน้าเว็บจะทำงานดังนี้:

“gif” ด้านบนแสดงให้เห็นว่าสไตล์ที่พิมพ์ในคลาสจะถูกลบออกด้วยการคลิกปุ่ม

บทสรุป

หากต้องการลบ CSS ออกจาก div ให้ใช้ปุ่ม “ ลบ Attr() ' และ ' ลบคลาส () ” สามารถใช้วิธีการต่างๆ “ ลบ Attr() ” ลบ “ สไตล์ แอตทริบิวต์จากองค์ประกอบที่เลือก ในทางกลับกัน “ ลบคลาส () ” ลบคลาสองค์ประกอบที่เลือกซึ่งถูกใช้สำหรับการใช้สไตล์กับองค์ประกอบนั้น บทความนี้ได้สาธิตวิธีลบ CSS ออกจาก div โดยใช้ jQuery เรียบร้อยแล้ว