Paano Mag-alis ng CSS Mula sa isang Div Gamit ang jQuery?

Paano Mag Alis Ng Css Mula Sa Isang Div Gamit Ang Jquery



Ang ilang intern o bagong developer ay nagdaragdag ng napakaraming katangian ng pag-istilo upang makabuo ng disenyo. Kung ang disenyo ay puno ng napakaraming mga estilo at ang tagapamahala ng proyekto ay nais na makita lamang ang HTML, dito ay maaaring alisin ng jQuery ang lahat ng mga estilo sa pamamagitan ng pagsulat ng 4 hanggang 5 linya ng code nito. Ito ay isang napakahusay at epektibong paraan sa pamamagitan ng pag-alis ng mga istilo at pagtingin sa istruktura ng div na iyon o ng HTML ng pahina.

Ipinapakita ng artikulong ito ang iba't ibang paraan upang alisin ang CSS mula sa isang div gamit ang jQuery.

Paano Mag-alis ng CSS Mula sa isang Div Gamit ang jQuery?

Upang alisin ang mga istilo ng CSS mula sa div, gamitin ang mga built-in na katangian ng jQuery. Mayroong dalawang paraan kung saan maaaring magdagdag o mag-alis ng mga istilo ang mga user, inline at gamit ang mga klase.





Paraan 1: Alisin ang Inline CSS Mula sa isang Div

Upang alisin ang mga inline na istilo na inilalapat sa elemento ng HTML, ang “ removeAttr() ” paraan ang ginagamit.



Ginagamit ito kapag kailangan ang maliit na pag-istilo ng isang elemento. Sundin ang mga hakbang sa ibaba upang harapin ito:



Hakbang 1: Gumawa ng Structure
Sa HTML file, lumikha ng '

” tag at magdagdag ng maraming elemento ng HTML sa loob nito. Halimbawa, '

”, “

'at'

'Ang mga tag ay ginagamit sa ibaba ng code:



< div >
< h1 > Kamusta Mga Gumagamit ng Linuxhint < / h1 >
< h2 > Ang Linuxhint ay ang lugar ng langit < / h2 >
< p > mga query na nauugnay sa mga programming language. < / p >
< / div >
< pindutan > Style Remover para sa Div < / pindutan >

Pagkatapos isagawa ang code sa itaas, ganito ang hitsura ng webpage:





Ipinapakita ng output ang HTML structure ng div at isang button.

Hakbang 2: Magdagdag ng Inline na Pag-istilo
Sa loob ng pambungad na tag ng div, ginagamit ang ' istilo ” at ilapat ang ilang mga katangian ng CSS upang gawing kitang-kita at kaakit-akit ang mga elemento:

< div istilo = '
kulay:darkmagenta;
kulay ng background: mediumaquamarine;
margin: 20px;
padding: 30px;' >
< h1 >Kumusta Mga Gumagamit ng Linuxhint< / h1 >
< h2 >Linuxhint ang lugar ng langit< / h2 >
< p >mga query na nauugnay sa mga programming language.< / p >
< / div >
< br >
< pindutan > Estilo Alisin para sa Div< / pindutan >

Ang output ng code sa itaas ay:

Kinukumpirma ng output na ang mga inline na istilo ay inilapat sa elemento ng div lamang.

Hakbang 3: Paggamit ng jQuery para Tanggalin ang Inline na CSS
Upang alisin ang mga katangian ng istilo, ang parent function ay tumatawag kapag ang ' dokumento 'ay' handa na ”. Sa code sa ibaba, tumatawag ang panloob na function kapag na-click ng user ang “ pindutan ”. Pagkatapos nito, pinipili ng function na ito ang lahat ng mga elemento ng div na naninirahan sa pahina at gamitin ang ' alisin.Attr() 'paraan:

< script >
$ ( dokumento ) .handa na ( function ( ) {
$ ( 'button' ) .click ( function ( ) {
$ ( 'div' ) .removeAttr ( 'estilo' ) ;
} ) ;
} ) ;
< / script >

Pagkatapos idagdag ang jQuery code, ang webpage ay gumagana tulad nito:

Ang 'gif' sa itaas ay naglalarawan na ang mga inilapat na istilo sa div ay inalis sa pamamagitan ng pag-click sa button.

Paraan 2: Alisin ang Class CSS mula sa isang Div

Ang pangalawang paraan ng pag-istilo ng HTML na elemento ay sa pamamagitan ng pagtatalaga sa kanila ng ' klase ”. Pagkatapos, magdagdag ng CSS sa bahagi ng klase sa loob ng “