Ako odstrániť CSS z Div pomocou jQuery?

Ako Odstranit Css Z Div Pomocou Jquery



Niektorí stážisti alebo noví vývojári pridávajú príliš veľa vlastností štýlu na vytvorenie dizajnu. Ak je dizajn zaťažený príliš veľkým počtom štýlov a projektový manažér chce vidieť iba HTML, tu môže jQuery odstrániť všetky štýly napísaním svojich 4 až 5 riadkov kódu. Je to veľmi efektívna a efektívna metóda odstránením štýlov a zobrazením štruktúry tohto div alebo HTML stránky.

Tento článok ukazuje rôzne metódy na odstránenie CSS z div pomocou jQuery.

Ako odstrániť CSS z Div pomocou jQuery?

Ak chcete odstrániť štýly CSS z prvku div, použite vstavané atribúty jQuery. Existujú dva spôsoby, pomocou ktorých môžu používatelia pridávať alebo odstraňovať štýly, inline a pomocou tried.





Metóda 1: Odstráňte inline CSS z Div

Ak chcete odstrániť vložené štýly, ktoré sú aplikované na prvok HTML, „ removeAttr() “ používa sa metóda.



Používa sa, keď je potrebný malý štýl prvku. Ak sa chcete s tým vysporiadať, postupujte podľa nasledujúcich krokov:



Krok 1: Vytvorte štruktúru
V súbore HTML vytvorte súbor „

” a pridajte do nej viacero prvkov HTML. Napríklad „

“, “

“ a „

V nižšie uvedenom kóde sa používajú značky ”:



< div >
< h1 > Ahojte používatelia Linuxhintu < / h1 >
< h2 > Linuxhint je miesto neba < / h2 >
< p > otázky týkajúce sa programovacích jazykov. < / p >
< / div >
< tlačidlo > Odstraňovač štýlu pre Div < / tlačidlo >

Po vykonaní vyššie uvedeného kódu bude webová stránka vyzerať takto:





Výstup zobrazuje štruktúru HTML prvku div a tlačidla.

Krok 2: Pridajte vložený štýl
Vo vnútri otváracej značky div sa používa „ štýl ” a aplikujte niektoré vlastnosti CSS, aby boli prvky výrazné a príťažlivé:

< div štýl = '
farba:tmavopurpurová;
farba pozadia: stredná akvamarínová;
okraj: 20px;
padding: 30px;' >
< h1 >Dobrý deň používatelia Linuxhint< / h1 >
< h2 >Linuxhint je miesto neba< / h2 >
< p >dotazy týkajúce sa programovacích jazykov.< / p >
< / div >
< br >
< tlačidlo > Štýl Odstrániť pre Div< / tlačidlo >

Výstup vyššie uvedeného kódu je:

Výstup potvrdzuje, že vložené štýly sa aplikujú iba na prvok div.

Krok 3: Použitie jQuery na odstránenie vloženého CSS
Ak chcete odstrániť atribúty štýlu, nadradená funkcia zavolá, keď „ dokument ' je ' pripravený “. V nižšie uvedenom kóde sa vnútorná funkcia volá, keď používateľ klikne na „ tlačidlo “. Potom táto funkcia vyberie všetky prvky div, ktoré sa nachádzajú na stránke a použije „ remove.Attr() “ metóda:

< skript >
$ ( dokument ) .pripravený ( funkciu ( ) {
$ ( 'tlačidlo' ) .kliknite ( funkciu ( ) {
$ ( 'div' ) .removeAttr ( 'štýl' ) ;
} ) ;
} ) ;
< / skript >

Po pridaní kódu jQuery funguje webová stránka takto:

Vyššie uvedený „gif“ ilustruje, že použité štýly na div sa odstránia kliknutím na tlačidlo.

Metóda 2: Odstráňte CSS triedy z prvku Div

Druhým spôsobom úpravy štýlu prvku HTML je priradiť im „ trieda “. Potom pridajte CSS do tejto časti triedy vnútri súboru „