Denne artikel vil demonstrere tilgange til at kontrollere, om en krop har en specifik klasse ved hjælp af JavaScript.
Hvordan kontrollerer man, om Body har en specifik klasse ved hjælp af JavaScript?
For at kontrollere, om en krop har en bestemt klasse ved hjælp af JavaScript, skal du anvende følgende fremgangsmåder:
- “ klasseliste ' ejendom og ' indeholder() ” metode.
- “ getElementsByTagName() ' og ' match() ' metoder.
- “ jQuery ”.
Lad os illustrere hver af tilgangene én efter én!
Fremgangsmåde 1: Tjek, om Body har en specifik klasse i JavaScript ved hjælp af classList Property og contains() Methods
Det ' klasseliste ” egenskab giver CSS-klassenavnene på et element. Mens ' indeholder() ”-metoden giver sand, hvis en node er en efterkommer. Disse kombinerede metoder kan anvendes til at få adgang til den indeholdte klasse i det tilknyttede element.
Syntaks
node. indeholder ( nøgen )
I ovenstående syntaks:
- “ nøgen ” svarer til noden efterkommer af den tilknyttede node.
Eksempel
Lad os få et overblik over nedenstående eksempel:
< centrum >< legeme klasse = 'indeholde' >
< h2 > Dette er Linuxhint hjemmeside h2 >
centrum > legeme >
< script type = 'tekst/javascript' >
hvis ( dokument. legeme . klasseliste . indeholder ( 'indeholde' ) ) {
konsol. log ( 'Kropselementet har klasse' ) ;
}
andet {
konsol. log ( 'Kropselementet har ikke klasse' ) ;
}
manuskript >
Anvend nedenstående trin, som angivet i ovenstående kode:
- For det første skal du inkludere en ' ' element med set-attributten ' klasse ”.
- Tilføj også en overskrift i det bestemte element( ).
- I JS-koden skal du anvende ' klasseliste ' ejendom kombineret med ' indeholder() ” metode.
- Dette vil resultere i adgang til klassen for den tilknyttede ' ” element baseret på det angivne klassenavn i metodens parameter.
- Ved opfyldt tilstand, ' hvis ” tilstand vil udføre.
- Modsat er ' andet ” sætningskodeblok udføres.
Produktion
I ovenstående output kan det ses, at den pågældende klasse er inkluderet i ' ' element.
Fremgangsmåde 2: Tjek, om Body har en specifik klasse i JavaScript ved hjælp af getElementsByTagName() og match() metoder
Det ' getElementsByTagName() ”-metoden giver en samling af alle elementer med et bestemt tagnavn. Det ' match() ”-metoden matcher den angivne værdi med strengen. Disse metoder kan bruges til at få adgang til det påkrævede element ved dets tag og kontrollere for den specifikke klasse.
Syntaks
dokument. getElementsByTagName ( tag )I den angivne syntaks:
- “ tag ” repræsenterer elementets tagnavn.
Eksempel
Følgende eksempel viser det diskuterede koncept:
< img src = 'skabelon2.png' højde = '150px' bredde = '150px' >
centrum > legeme >
< script type = 'tekst/javascript' >
lade få = dokument. getElementsByTagName ( 'legeme' ) [ 0 ] . klassenavn . match ( /indeholder/ )
hvis ( få ) {
konsol. log ( 'Kropselementet har klasse' ) ;
}
andet {
konsol. log ( 'Kropselementet har ikke klasse' ) ;
}
manuskript >
I ovenstående kodestykke:
- Inkluder ligeledes en ' ” element med den angivne klasse.
- Indeholder også et billede med de indstillede dimensioner inden for det angivne element i det foregående trin.
- I JavaScript-kodelinjerne skal du få adgang til ' ' element ved dets tag ved hjælp af ' getElementsByTagName() ” metode.
- Det ' [0] ” angiver, at det første element, der svarer til det angivne tag i det foregående trin, vil blive hentet.
- Det ' klassenavn ' ejendom og ' match() '-metoden vil matche for den angivne klasse i dens parameter mod ' ' element.
- Den tidligere udtalelse i ' hvis ” condition vil udføres, når alle betingelserne i de foregående trin er opfyldt.
- Ellers vil sidstnævnte erklæring blive vist.
Produktion
Ovenstående output indikerer, at den anvendte betingelse for en specifik klasse er opfyldt.
Fremgangsmåde 3: Tjek om Body har en specifik klasse i JavaScript ved hjælp af jQuery
Denne tilgang kan implementeres for at få direkte adgang til det nødvendige element og lokalisere den specifikke klasse mod det ved hjælp af dens metode ganske enkelt.
Eksempel
Lad os gennemgå nedenstående eksempel:
< centrum >< legeme klasse = 'indeholder' >
< tekstområde pladsholder = 'Skriv en hvilken som helst tekst...' > tekstområde >
centrum > legeme >
hvis ( $ ( 'legeme' ) . har Klasse ( 'indeholder' ) ) {
alert ( 'Kropselementet har klasse' )
}
andet {
alert ( 'Kropselementet har ikke klasse' )
}
manuskript >
I ovenstående kodelinjer:
- Inkluder ' jQuery ”-biblioteket for at udnytte dets funktionaliteter.
- På samme måde skal du inkludere ' ” element med den angivne klasse.
- Tilføj også en '
” element i det angivne element i det foregående trin. - I JS-koden skal du få adgang til ' ' element. Anvend også ' hasClass() ” metode til at søge efter den angivne klasse i det hentede element.
- Dette vil som resultat advare den tidligere meddelelse, når den er opfyldt.
- I det andet tilfælde vil sidstnævnte erklæring blive vist.
Produktion
Ovenstående output indebærer, at det ønskede krav er opnået.
Konklusion
Det ' klasseliste ' ejendom og ' indeholder() 'metoden, ' getElementsByTagName() ' og ' match() ”-metoder eller ” jQuery ” kan bruges til at kontrollere, om en krop har en bestemt klasse ved hjælp af JavaScript. Disse tilgange kan bruges til at søge efter den bestemte klasse i et element ved at henvise til det tilsvarende element direkte, ved dets tag eller ved at bruge jQuery-metoden. Denne blog forklarede for at kontrollere, om en krop har en bestemt klasse i JavaScript