Denne artikkelen demonstrerer formålet, funksjonaliteten og bruken av HTML DOM Input Radio 'sjekket'-egenskapen i JavaScript.
Hva er HTML DOM Input Radio 'sjekket' egenskapen i JavaScript?
Egenskapen Input Radio 'sjekket' fungerer på HTML-skjemaene og inndatafeltene for å angi og sjekke statusen til 'Radio'-knappen.
Syntaks (sett avkrysset egenskap)
radioObject. krysset av = ekte | falskI henhold til den definerte retursyntaksen, støtter 'checked'-egenskapen to parametere som er oppført nedenfor:
- ekte: Det representerer at det tilsvarende elementet er sjekket.
- falsk: Det indikerer at det tilsvarende elementet er umerket.
Syntaks (Retursjekket egenskap)
radioObject. krysset avI syntaksen ovenfor, ' radioObject ' refererer til HTML ' ' element hvis type er 'radio'.
La oss bruke de ovenfor definerte syntaksene for å forklare bruken av HTML DOM Input Radio 'sjekket' egenskap ved hjelp av gitte praktiske eksempler.
Eksempel 1: Bruk av Input Radio 'sjekket' egenskap Bruker grunnleggende syntaks
I det første eksemplet er 'Radio'-knappen opprettet for å angi egenskapen 'avmerket' ved å bruke den definerte generaliserte syntaksen.
HTML-kode
Først, se på den angitte HTML-koden:
< kroppsstil = 'text-align: center' >
< h2 > HTML DOM Input Radio Sjekket egenskap h2 >
Farge : < inndatatype = 'radio' id = 'gul' > Gul < br >< br >
< knappen ved å klikke = 'colorCheck()' > Kryss av 'gul' knapp >
< knappen ved å klikke = 'colorUncheck()' > Fjern merket 'gul' knapp >
I kodelinjene ovenfor:
- « '-taggen definerer hoveddelen som er justert til ' senter '.
- « ”-taggen spesifiserer den første underoverskriften.
- « '-taggen legger til en 'Radio'-knapp ved å spesifisere inngangstypen ' radio ' med en tildelt id ' gul '.
- «
'-taggen legger til en enkel knapp knyttet til en ' ved trykk '-hendelse for å utføre ' colorCheck() ”-funksjonen som vil bli åpnet ved knappeklikk. - På samme måte, en annen '
'-taggen oppretter en knapp for å påkalle ' colorUncheck() ”-funksjonen når du klikker på knappen.
JavaScript-kode
Deretter følger du den gitte JavaScript-koden:
< manus >funksjon colorCheck ( ) {
dokument. getElementById ( 'gul' ) . krysset av = ekte ;
}
funksjon fargeFjern merket ( ) {
dokument. getElementById ( 'gul' ) . krysset av = falsk ;
}
manus >
I kodebiten ovenfor:
- Den første funksjonen ' colorCheck() ' bruker ' document.getElementById() '-metoden for å hente alternativknappen, tilknytt ' krysset av ' egenskap og sett verdien til 'true'.
- På den annen side, funksjonen ' colorUncheck() ' angir verdien av ' krysset av '-egenskapen til 'false' mot den åpnede alternativknappen.
Produksjon
Som sett sjekker utgangen 'Radio'-knappen ved knappen (kalt 'Sjekk') klikk og fjerner merket ved knappen ('Fjern merket').
Eksempel 2: Returnerer 'kontrollert' verdi for inngangsradioen
Dette eksemplet bruker Input Radio 'checked'-egenskapen for å returnere tilstanden til den målrettede 'Radio'-knappen som en boolsk verdi.
HTML-kode
Tenk på følgende HTML-kode:
< kroppsstil = 'text-align: center' >< h2 > HTML DOM Input Radio Sjekket egenskap h2 >
Farge : < inndatatype = 'radio' krysset av = ekte id = 'gul' > Gul < br >< br >
< knappen ved å klikke = 'colorCheck()' > Kryss av 'gul' knapp >
< p id = 'prøve' >< s >
I kodeblokken ovenfor, ' Radio '-knappen er opprettet og statusen til ' krysset av egenskapen er satt til ekte '. Etter det påkalles den oppgitte funksjonen på samme måte via den vedlagte ' ved trykk ” hendelse med knappen.
JavaScript-kode
Tenk nå på følgende kodelinjer:
< manus >funksjon colorCheck ( ) {
hvor = dokument. getElementById ( 'gul' ) . defaultChecked ;
dokument. getElementById ( 'prøve' ) . indreHTML = t ;
}
manus >
I kodebiten ovenfor:
- Definer en funksjon kalt ' colorCheck() '.
- I sin definisjon, bruk ' document.getElementById() '-metoden for å få tilgang til 'Radio'-knappen ved å bruke ID-en 'gul' og knytte ' defaultChecked '-egenskapen for å sjekke standardverdien til ' krysset av ' Egenskap.
- Til slutt, bruk ' document.getElementById() ”-metoden igjen for å hente det inkluderte tomme avsnittet og vise statusen til egenskapen “avmerket”.
.
Produksjon
Som analysert, returnerer utfallet statusen til den gitte 'Radio'-knappen, dvs. ' ekte ' når knappen klikker.
Konklusjon
I JavaScript er HTML DOM Input Radio 'sjekket'-egenskapen nyttig for å angi og returnere den sjekkede statusen til 'Radio'-knappen. Den angitte syntaksen til egenskapen 'avmerket' fungerer på to verdier ' ekte ' og ' falsk '. På den annen side krever ikke retursyntaksen noen parameter. Denne artikkelen demonstrerte objektivet, funksjonaliteten og bruken av HTML DOM Input Radio 'sjekket'-egenskapen i JavaScript.