», «

' και '

Οι ετικέτες ' χρησιμοποιούνται στον παρακάτω κώδικα:

---

---

< div >
< h1 > Γεια σας χρήστες Linuxhint < / h1 >
< h2 > Το Linuxhint είναι ο τόπος του ουρανού < / h2 >
< Π > ερωτήματα που σχετίζονται με γλώσσες προγραμματισμού. < / Π >
< / div >
< κουμπί > Style Remover για Div < / κουμπί >

Μετά την εκτέλεση του παραπάνω κώδικα, η ιστοσελίδα μοιάζει με αυτό:

Η έξοδος δείχνει τη δομή HTML του div και ένα κουμπί.

Βήμα 2: Προσθήκη Inline Styling
Μέσα στην ετικέτα ανοίγματος div, χρησιμοποιεί το ' στυλ ” αποδώστε και εφαρμόστε ορισμένες ιδιότητες CSS για να κάνετε τα στοιχεία εμφανή και ελκυστικά:

< div στυλ = '
χρώμα: σκούρο ματζέντα;
Χρώμα φόντου: mediumaquamarine;
περιθώριο: 20 px;
padding: 30px;' >
< h1 >Γεια σας χρήστες Linuxhint< / h1 >
< h2 >Το Linuxhit είναι ο τόπος του ουρανού< / h2 >
< Π >ερωτήματα που σχετίζονται με γλώσσες προγραμματισμού.< / Π >
< / div >
< br >
< κουμπί > Στυλ Αφαιρώ Για Div< / κουμπί >

Η έξοδος του παραπάνω κώδικα είναι:

Η έξοδος επιβεβαιώνει ότι τα ενσωματωμένα στυλ εφαρμόζονται μόνο στο στοιχείο div.

Βήμα 3: Χρήση του jQuery για την κατάργηση του Inline CSS
Για να αφαιρέσετε χαρακτηριστικά στυλ, η γονική συνάρτηση καλεί όταν το ' έγγραφο ' είναι ' έτοιμος '. Στον παρακάτω κώδικα, η εσωτερική συνάρτηση καλεί όταν ο χρήστης κάνει κλικ στο ' κουμπί '. Μετά από αυτό, αυτή η συνάρτηση επιλέγει όλα τα στοιχεία div που βρίσκονται στη σελίδα και χρησιμοποιεί το ' remove.Attr() 'μέθοδος:

< γραφή >
$ ( έγγραφο ) .έτοιμος ( λειτουργία ( ) {
$ ( 'κουμπί' ) .Κάντε κλικ ( λειτουργία ( ) {
$ ( 'div' ) .removeAttr ( 'στυλ' ) ;
} ) ;
} ) ;
< / γραφή >

Μετά την προσθήκη του κώδικα jQuery, η ιστοσελίδα λειτουργεί ως εξής:

Το παραπάνω 'gif' δείχνει ότι τα εφαρμοσμένα στυλ στο div αφαιρούνται κάνοντας κλικ στο κουμπί.

Μέθοδος 2: Καταργήστε την κλάση CSS από ένα Div

Ο δεύτερος τρόπος διαμόρφωσης στυλ του στοιχείου HTML είναι με την εκχώρηση ενός ' τάξη '. Στη συνέχεια, προσθέστε CSS σε αυτό το τμήμα κλάσης μέσα στο ' <στυλ> 'ετικέτα ή σε ξεχωριστό' αρχείο CSS '. Αυτά τα στυλ μπορούν επίσης να αφαιρεθούν χρησιμοποιώντας jQuery. Ακολουθήστε τα παρακάτω βήματα:

Βήμα 1: Αντιστοιχίστε μια κλάση στο στοιχείο Div
Στο αρχείο HTML, αντιστοιχίστε ένα χαρακτηριστικό κλάσης στο '

' στοιχείο. Επίσης, αντιστοιχίστε ένα αναγνωριστικό 'αφαίρεσης' στο ' <κουμπί> Ετικέτα ':

< div τάξη = 'στυλ' >
< h1 >Γεια σας χρήστες Linuxhint< / h1 >
< h2 >Το Linuxhit είναι ο τόπος του ουρανού< / h2 >
< Π >ερωτήματα που σχετίζονται με γλώσσες προγραμματισμού.< / Π >
< / div >
< κουμπί ταυτότητα = 'αφαιρώ' > Στυλ Αφαίρεση < / κουμπί >

Στη συνέχεια, μεταβείτε στο ' <στυλ> ' Προσθέστε ετικέτα και επιλέξτε το όνομα της κλάσης div ' styling ” και πληκτρολογήστε ιδιότητες CSS που εφαρμόζονται στο στοιχείο div:

< στυλ >
.στιλινγκ {
χρώμα :χρυσοχέρι;
Ιστορικό- χρώμα : πράσινη θάλασσα;
περιθώριο: 20 px;
padding: 30px;
}
< / στυλ >

Μετά την εκτέλεση του παραπάνω κώδικα, η ιστοσελίδα μοιάζει με αυτό:

Η έξοδος δείχνει ότι τα στυλ εφαρμόζονται στο στοιχείο div.

Βήμα 2: Προσθέστε jQuery για να αφαιρέσετε το στυλ CSS
Στο ' <σενάριο> Προσθέστε ετικέτα jQuery όπως αναφέρεται στην παραπάνω μέθοδο. Το jQuery ' removeClass() Η μέθοδος ' αφαιρεί το ' styling ” κλάση που εκχωρείται με το στοιχείο “div” όταν πατηθεί το κουμπί:

< γραφή >
$ ( έγγραφο ) .έτοιμος ( λειτουργία ( ) {
$ ( 'κουμπί' ) .Κάντε κλικ ( λειτουργία ( ) {
$ ( 'div' ) .removeClass ( 'στυλ' ) ;
} ) ;
} ) ;
< / γραφή >

Μετά την προσθήκη του παραπάνω κώδικα, η ιστοσελίδα λειτουργεί ως εξής:

Το παραπάνω 'gif' δείχνει ότι τα στυλ που πληκτρολογήθηκαν στην τάξη αφαιρούνται με ένα κλικ στο κουμπί.

συμπέρασμα

Για να αφαιρέσετε το CSS από ένα div, το ' remove.Attr() ' και ' removeClass() μπορούν να χρησιμοποιηθούν μέθοδοι. Ο ' remove.Attr() ' αφαιρεί το ' στυλ ” χαρακτηριστικό από το στοιχείο που έχει επιλεγεί. Από την άλλη πλευρά, το « removeClass() ” καταργεί την επιλεγμένη κλάση στοιχείων που χρησιμοποιήθηκε για την εφαρμογή στυλ σε αυτό το στοιχείο. Αυτό το άρθρο έχει δείξει με επιτυχία πώς να αφαιρέσετε το CSS από ένα div χρησιμοποιώντας jQuery.