Suriin kung ang Body ay may Tukoy na Klase Gamit ang JavaScript

Suriin Kung Ang Body Ay May Tukoy Na Klase Gamit Ang Javascript



Habang nagdidisenyo ng web page o ng site, maaaring may posibilidad na pagbukud-bukurin ang mga katulad na functionality laban sa isang nakalaang klase sa dulo ng developer. Halimbawa, ang paglalaan ng partikular na web page sa parehong elemento ngunit may natatanging klase upang gawing may kaugnayan ang mga bagay. Sa ganitong mga sitwasyon, ang pagsuri kung ang isang katawan ay may isang partikular na klase ay tumutulong sa pag-access ng iba't ibang mga pag-andar nang madali at sa mga proseso ng pag-update din.

Ipapakita ng artikulong ito ang mga diskarte upang suriin kung ang isang katawan ay may partikular na klase gamit ang JavaScript.

Paano Suriin kung ang Katawan ay may Tukoy na Klase Gamit ang JavaScript?

Upang suriin kung ang isang katawan ay may partikular na klase gamit ang JavaScript, ilapat ang mga sumusunod na diskarte:





  • “ Listahan ng klase ' ari-arian at ' naglalaman ng() ” paraan.
  • “ getElementsByTagName() 'at' tugma() ' paraan.
  • “ jQuery ”.

Ilarawan natin ang bawat isa sa mga diskarte!



Diskarte 1: Suriin kung ang Body ay may Tukoy na Klase sa JavaScript Gamit ang classList Property at naglalaman ng() na mga Paraan

Ang ' Listahan ng klase Ang ” property ay nagbibigay sa CSS class name ng isang elemento. Samantalang ang ' naglalaman ng() Ang pamamaraan ay nagbibigay ng totoo kung ang isang node ay isang inapo. Ang mga pamamaraang ito na pinagsama ay maaaring ilapat upang ma-access ang nakapaloob na klase sa nauugnay na elemento.



Syntax



node. naglalaman ng ( hubad )

Sa itaas na syntax:

  • “ hubad ” ay tumutugma sa node descendant ng nauugnay na node.

Halimbawa
Magkaroon tayo ng pangkalahatang-ideya ng ibinigay na halimbawa sa ibaba:



< gitna >< katawan klase = 'naglalaman' >
< h2 > Ito ay Linuxhint Website h2 >
gitna > katawan >
< uri ng script = 'text/javascript' >
kung ( dokumento. katawan . Listahan ng klase . naglalaman ng ( 'naglalaman' ) ) {
console. log ( 'May klase ang elemento ng katawan' ) ;
}
iba pa {
console. log ( 'Walang klase ang elemento ng katawan' ) ;
}
iskrip >

Ilapat ang mga hakbang na nakasaad sa ibaba, gaya ng ibinigay sa code sa itaas:

  • Una, isama ang isang ' 'elemento na may nakatakdang katangian' klase ”.
  • Gayundin, magdagdag ng isang heading sa loob ng partikular na elemento( ).
  • Sa JS code, ilapat ang ' Listahan ng klase ” property na sinamahan ng “ naglalaman ng() ” paraan.
  • Ito ay magreresulta sa pag-access sa klase ng nauugnay na ' ” elemento batay sa tinukoy na pangalan ng klase sa parameter ng pamamaraan.
  • Sa nasiyahang kondisyon, ang ' kung ” ipapatupad ang kundisyon.
  • Sa kabaligtaran, ang ' iba pa ” ipapatupad ang statement code block.

Output

Sa output sa itaas, makikita na ang partikular na klase ay kasama sa ' ' elemento.

Diskarte 2: Suriin kung ang Body ay may Tukoy na Klase sa JavaScript Gamit ang getElementsByTagName() at match() Methods

Ang ' getElementsByTagName() ” paraan ay nagbibigay ng isang koleksyon ng lahat ng mga elemento na may partikular na pangalan ng tag. Ang ' tugma() ” na pamamaraan ay tumutugma sa tinukoy na halaga sa string. Ang mga paraang ito ay maaaring gamitin upang ma-access ang kinakailangang elemento sa pamamagitan ng tag nito at suriin ang partikular na klase.

Syntax

dokumento. getElementsByTagName ( tag )

Sa ibinigay na syntax:

  • “ tag ” ay kumakatawan sa pangalan ng tag ng elemento.

Halimbawa
Ang sumusunod na halimbawa ay nagpapakita ng tinalakay na konsepto:

< gitna >< katawan klase = 'naglalaman' >
< img src = 'template2.png' taas = '150px' lapad = '150px' >
gitna > katawan >
< uri ng script = 'text/javascript' >
hayaan makuha = dokumento. getElementsByTagName ( 'katawan' ) [ 0 ] . pangalan ng klase . tugma ( /naglalaman/ )
kung ( makuha ) {
console. log ( 'May klase ang elemento ng katawan' ) ;
}
iba pa {
console. log ( 'Walang klase ang elemento ng katawan' ) ;
}
iskrip >

Sa snippet ng code sa itaas:

  • Gayundin, isama ang isang ' ” elementong mayroong tinukoy na klase.
  • Gayundin, maglaman ng larawan na may mga nakatakdang sukat sa loob ng nakasaad na elemento sa nakaraang hakbang.
  • Sa mga linya ng code ng JavaScript, i-access ang ' ” elemento sa pamamagitan ng tag nito gamit ang “ getElementsByTagName() ” paraan.
  • Ang ' [0] ” ay nagpapahiwatig na ang unang elemento na tumutugma sa nakasaad na tag sa nakaraang hakbang ay kukunin.
  • Ang ' pangalan ng klase ' ari-arian at ang ' tugma() Ang paraan ng ” ay tutugma para sa nakasaad na klase sa parameter nito laban sa “ ' elemento.
  • Ang dating pahayag sa ' kung ” ang kundisyon ay isasagawa kapag natugunan ang lahat ng mga kundisyon sa mga naunang hakbang.
  • Kung hindi, ang huling pahayag ay ipapakita.

Output

Ang output sa itaas ay nagpapahiwatig na ang inilapat na kondisyon para sa isang partikular na klase ay nasiyahan.

Diskarte 3: Suriin kung ang Body ay may Tukoy na Klase sa JavaScript Gamit ang jQuery

Ang diskarte na ito ay maaaring ipatupad upang direktang ma-access ang kinakailangang elemento at mahanap ang partikular na klase laban dito sa tulong ng pamamaraan nito nang simple.

Halimbawa
Dumaan tayo sa ibinigay na halimbawa sa ibaba:

< script src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js' > iskrip >
< gitna >< katawan klase = 'naglalaman' >
< placeholder ng textarea = 'Mag-type ng anumang text...' > textarea >
gitna > katawan >

kung ( $ ( 'katawan' ) . mayClass ( 'naglalaman' ) ) {
alerto ( 'May klase ang elemento ng katawan' )
}
iba pa {
alerto ( 'Walang klase ang elemento ng katawan' )
}
iskrip >

Sa itaas na mga linya ng code:

  • Isama ang ' jQuery ” library upang magamit ang mga functionality nito.
  • Katulad nito, isama ang ' ” elementong may nakasaad na klase.
  • Gayundin, magdagdag ng '