”, “

' Và '

” thẻ được sử dụng trong đoạn mã dưới đây:

---

---

< div >
< h1 > Xin chào người dùng Linuxhint < / h1 >
< h2 > Linuxhint là nơi thiên đường < / h2 >
< P > truy vấn liên quan đến ngôn ngữ lập trình. < / P >
< / div >
< cái nút > Công cụ xóa kiểu cho Div < / cái nút >

Sau khi thực thi đoạn mã trên, trang web trông như thế này:

Đầu ra hiển thị cấu trúc HTML của div và một nút.

Bước 2: Thêm kiểu dáng nội tuyến
Bên trong thẻ mở div, sử dụng “ phong cách ” và áp dụng một số thuộc tính CSS để làm cho các phần tử trở nên nổi bật và hấp dẫn:

< div phong cách = '
màu sắc: màu đỏ tươi;
màu nền: mediumaquamarine;
lề: 20px;
phần đệm: 30px;' >
< h1 >Xin chào người dùng Linuxhint< / h1 >
< h2 >Linuxhint là thiên đường< / h2 >
< P >truy vấn liên quan đến ngôn ngữ lập trình.< / P >
< / div >
< anh >
< cái nút > Phong cách Di dời vì div< / cái nút >

Đầu ra của đoạn mã trên là:

Đầu ra xác nhận rằng các kiểu nội tuyến chỉ được áp dụng cho phần tử div.

Bước 3: Sử dụng jQuery để loại bỏ CSS nội tuyến
Để xóa thuộc tính kiểu, hàm cha gọi khi “ tài liệu ' là ' sẵn sàng ”. Trong đoạn mã dưới đây, hàm bên trong gọi khi người dùng nhấp vào “ cái nút ”. Sau đó, chức năng này chọn tất cả các phần tử div nằm trên trang và sử dụng “ xóa.Attr() ' phương pháp:

< kịch bản >
$ ( tài liệu ) .sẵn sàng ( chức năng ( ) {
$ ( 'cái nút' ) .nhấp chuột ( chức năng ( ) {
$ ( 'div' ) .removeAttr ( 'phong cách' ) ;
} ) ;
} ) ;
< / kịch bản >

Sau khi thêm mã jQuery, trang web sẽ hoạt động như sau:

“Gif” ở trên minh họa rằng các kiểu được áp dụng trên div sẽ bị xóa bằng cách nhấp vào nút.

Phương pháp 2: Xóa Class CSS khỏi Div

Cách thứ hai để tạo kiểu cho phần tử HTML là gán cho chúng một “ lớp học ”. Sau đó, thêm CSS vào phần lớp đó bên trong “ ” hoặc trong một “ riêng biệt tệp CSS ”. Các kiểu này cũng có thể được xóa bằng jQuery. Thực hiện theo các bước dưới đây:

Bước 1: Gán một lớp cho phần tử Div
Trong tệp HTML, gán thuộc tính lớp cho “

' yếu tố. Ngoài ra, chỉ định một id của 'tẩy trang' cho ' ' nhãn:

< div lớp học = 'kiểu dáng' >
< h1 >Xin chào người dùng Linuxhint< / h1 >
< h2 >Linuxhint là thiên đường< / h2 >
< P >truy vấn liên quan đến ngôn ngữ lập trình.< / P >
< / div >
< cái nút nhận dạng = 'di dời' > Phong cách Xóa < / cái nút >

Tiếp theo, đi đến phần “ ” gắn thẻ và chọn tên lớp div “ kiểu dáng ” và nhập các thuộc tính CSS được áp dụng cho phần tử div:

< phong cách >
.tạo kiểu {
màu sắc :thanh vàng;
lý lịch- màu sắc : xanh nước biển;
lề: 20px;
phần đệm: 30px;
}
< / phong cách >

Sau khi thực thi đoạn mã trên, trang web trông như thế này:

Đầu ra hiển thị rằng các kiểu được áp dụng trên phần tử div.

Bước 2: Thêm jQuery để xóa kiểu CSS
Bên trong ' ” thẻ thêm mã jQuery giống như đã nêu trong phương pháp trên. jQuery “ loại bỏClass() ” phương pháp loại bỏ các “ kiểu dáng ” lớp được gán với phần tử “div” khi nhấp vào nút:

< kịch bản >
$ ( tài liệu ) .sẵn sàng ( chức năng ( ) {
$ ( 'cái nút' ) .nhấp chuột ( chức năng ( ) {
$ ( 'div' ) .removeClass ( 'kiểu dáng' ) ;
} ) ;
} ) ;
< / kịch bản >

Sau khi thêm đoạn mã trên, trang web hoạt động như thế này:

“Gif” ở trên minh họa rằng các kiểu đã nhập trong lớp sẽ bị xóa bằng một lần bấm nút.

Phần kết luận

Để xóa CSS khỏi div, lệnh “ xóa.Attr() ' Và ' loại bỏClass() ” phương pháp có thể được sử dụng. Các ' xóa.Attr() ” loại bỏ “ phong cách ” thuộc tính từ phần tử được chọn. Mặt khác, “ loại bỏClass() ” xóa lớp phần tử đã chọn đang được sử dụng để áp dụng kiểu cho phần tử đó. Bài viết này đã trình bày thành công cách xóa CSS khỏi div bằng jQuery.