Šiame straipsnyje bus parodyta, kaip patikrinti, ar kūnas turi tam tikrą klasę naudojant „JavaScript“.
Kaip patikrinti, ar kūnas turi tam tikrą klasę naudojant „JavaScript“?
Norėdami patikrinti, ar turinys turi tam tikrą klasę naudojant „JavaScript“, taikykite šiuos metodus:
- “ klasių sąrašas “ nuosavybė ir “ yra () “ metodas.
- “ getElementsByTagName() “ ir „ atitikimas () “ metodai.
- “ jQuery “.
Iliustruokite kiekvieną metodą po vieną!
1 metodas: patikrinkite, ar turinys turi specifinę klasę „JavaScript“, naudodami „classList“ ypatybę ir ar yra() metodai
„ klasių sąrašas ” ypatybė suteikia elemento CSS klasės pavadinimus. kadangi „ yra () “ metodas suteikia teisingą, jei mazgas yra palikuonis. Šie metodai kartu gali būti taikomi norint pasiekti susijusio elemento esančią klasę.
Sintaksė
mazgas. yra ( nuogas )
Aukščiau pateiktoje sintaksėje:
- “ nuogas “ atitinka susieto mazgo palikuonį.
Pavyzdys
Apžvelkime toliau pateiktą pavyzdį:
< centras >< kūnas klasė = 'sudėtyje' >
< h2 > Tai yra „Linuxhint“ svetainė h2 >
centras > kūnas >
< scenarijaus tipas = 'tekstas/javascript' >
jeigu ( dokumentas. kūnas . klasių sąrašas . yra ( 'sudėtyje' ) ) {
konsolė. žurnalas ( „Kūno elementas turi klasę“ ) ;
}
Kitas {
konsolė. žurnalas ( „Kūno elementas neturi klasės“ ) ;
}
scenarijus >
Atlikite toliau nurodytus veiksmus, kaip nurodyta aukščiau pateiktame kode:
- Pirmiausia įtraukite „
' elementas, turintis atributą ' klasė “. - Be to, prie konkretaus elemento ( ) pridėkite antraštę.
- JS kode taikykite „ klasių sąrašas “ nuosavybė kartu su “ yra () “ metodas.
- Dėl to bus suteikta prieiga prie susijusios 'klasės
“ elementas, pagrįstas metodo parametre nurodytu klasės pavadinimu. - Esant patenkintai sąlygai, „ jeigu “ sąlyga bus įvykdyta.
- Priešingai, „ Kitas “ bus vykdomas teiginio kodo blokas.
Išvestis
Aukščiau pateiktame išvestyje matyti, kad konkreti klasė yra įtraukta į '
2 metodas: patikrinkite, ar turinys turi specifinę klasę „JavaScript“, naudodami getElementsByTagName() ir match() metodus
„ getElementsByTagName() “ metodas suteikia visų elementų, turinčių tam tikrą žymos pavadinimą, rinkinį. „ atitikimas () “ metodas atitinka nurodytą reikšmę su eilute. Šie metodai gali būti naudojami norint pasiekti reikiamą elementą pagal jo žymą ir patikrinti, ar nėra konkrečios klasės.
Sintaksė
dokumentas. getElementsByTagName ( žyma )Pateiktoje sintaksėje:
- “ žyma “ reiškia elemento žymos pavadinimą.
Pavyzdys
Šis pavyzdys parodo aptartą koncepciją:
< img src = 'template2.png' aukščio = '150 piks.' plotis = '150 piks.' >
centras > kūnas >
< scenarijaus tipas = 'tekstas/javascript' >
leisti gauti = dokumentas. getElementsByTagName ( 'kūnas' ) [ 0 ] . klasės pavadinimas . rungtynės ( /yra/ )
jeigu ( gauti ) {
konsolė. žurnalas ( „Kūno elementas turi klasę“ ) ;
}
Kitas {
konsolė. žurnalas ( „Kūno elementas neturi klasės“ ) ;
}
scenarijus >
Aukščiau pateiktame kodo fragmente:
- Taip pat įtraukite „
“ elementas, turintis nurodytą klasę. - Be to, įtraukite vaizdą su nustatytais matmenimis ankstesniame veiksme nurodytame elemente.
- „JavaScript“ kodo eilutėse pasiekite „
“ elementą pagal savo žymą naudojant „ getElementsByTagName() “ metodas. - „ [0] “ reiškia, kad bus paimtas pirmasis elementas, atitinkantis ankstesniame veiksme nurodytą žymą.
- „ klasės pavadinimas “ nuosavybė ir “ atitikimas () ' metodas atitiks nurodytą klasę savo parametre su '
“ elementas. - Buvęs teiginys „ jeigu “ sąlyga bus įvykdyta įvykdžius visas ankstesniuose žingsniuose nurodytas sąlygas.
- Priešingu atveju bus rodomas pastarasis teiginys.
Išvestis
Aukščiau pateikta išvestis rodo, kad taikoma konkrečios klasės sąlyga yra įvykdyta.
3 metodas: naudodami jQuery patikrinkite, ar „Body“ turi specifinę „JavaScript“ klasę
Šis metodas gali būti įgyvendintas norint tiesiogiai pasiekti reikiamą elementą ir paprasčiausiai rasti konkrečią klasę prieš jį naudojant jo metodą.
Pavyzdys
Panagrinėkime toliau pateiktą pavyzdį:
< centras >< kūnas klasė = 'yra' >
< textarea vietos rezervavimo priemonė = 'Įveskite bet kokį tekstą...' > teksto sritis >
centras > kūnas >
jeigu ( $ ( 'kūnas' ) . hasClass ( 'yra' ) ) {
budrus ( „Kūno elementas turi klasę“ )
}
Kitas {
budrus ( „Kūno elementas neturi klasės“ )
}
scenarijus >
Aukščiau pateiktose kodo eilutėse:
- Įtraukite ' jQuery “ biblioteką, kad pasinaudotų jos funkcijomis.
- Panašiai įtraukite „
“ elementas, turintis nurodytą klasę. - Taip pat pridėkite „
“ elementą, esantį ankstesniame veiksme nurodytame elemente. - JS kode pasiekite „
“ elementas. Taip pat taikykite „ hasClass () “ metodą, norėdami ieškoti nurodytos klasės gautame elemente. - Tai įspės ankstesnį pranešimą apie patenkintą sąlygą.
- Kitu atveju bus rodomas pastarasis teiginys.
Išvestis
Aukščiau pateiktas rezultatas reiškia, kad norimas reikalavimas yra pasiektas.
Išvada
„ klasių sąrašas “ nuosavybė ir “ yra () “ metodas, „ getElementsByTagName() “ ir „ atitikimas () “ metodus arba „ jQuery “ galima naudoti norint patikrinti, ar kūnas turi tam tikrą klasę naudojant „JavaScript“. Šie metodai gali būti naudojami ieškant konkrečios klasės elemente, tiesiogiai nurodant atitinkamą elementą, naudojant jo žymą arba naudojant jQuery metodą. Šiame tinklaraštyje paaiškinta, kaip patikrinti, ar kūnas turi tam tikrą „JavaScript“ klasę