Šis straipsnis trumpai parodo, kas yra DOM elemento „click()“ metodas ir kaip jį naudoti HTML?
Kas yra DOM elemento „click()“ metodas HTML?
Kai metodas click() iškviečiamas HTML elemente, jis imituoja vartotoją, spustelėjusį elementą pele, o tai savo ruožtu suaktyvina visas pridėtas įvykių tvarkykles. Tai leidžia kūrėjams atlikti keletą interaktyvių veiksmų, pvz., atidaryti nuorodas, pateikti formas arba perjungti elementų matomumą be fizinio pelės paspaudimo. Tai padeda kurti interaktyvius ir reaguojančius tinklalapius.
Kaip naudoti DOM elemento „click()“ metodą HTML?
Norėdami naudoti click() metodą, vartotojai pirmiausia turi gauti nuorodą į HTML elementą, kad imituotų paspaudimą. Tai galima padaryti naudojant bet kurį standartinį DOM perėjimo ar užklausos metodą, pvz., „ getElementById “, „ getElementsByClassName “, „ querySelector “ arba „ querySelectorAll “.
Peržiūrėkime pavyzdį, kad geriau paaiškintume „click()“ metodą.
Pavyzdys: HTML žymimasis laukelis ir radijo mygtuko elementai
Nagrinėjamas pavyzdys, kuriame „ spustelėkite () “ metodas naudojamas su HTML žymimuoju laukeliu ir radijo mygtuko elementais. Sekite toliau pateiktą kodą:
< forma >
< įvestis
tipo = 'žymimasis langelis'
id = 'checkbox1'
užveskite pelės žymeklį = 'forCheckbox()'
>
Naudojama Linuxhint
< įvestis
tipo = 'radijas'
id = 'radijo mygtukas'
užveskite pelės žymeklį = 'Radijui ()'
>
Naudojama Linuxhint
< / forma >
Aukščiau pateiktame kodo fragmente:
- Pirmiausia tinklalapyje sukuriamas žymimasis laukelis naudojant žymą , kurios tipas nustatytas į ' žymimasis langelis “.
- Po to renginio klausytojas “ užveskite pelės žymeklį “ yra pridėtas prie žymimojo laukelio ir iškviečia „ forCheckbox () ' funkcija.
- Lygiai taip pat „ radijas “ mygtukas sukuriamas naudojant „ <įvestis> “ žymą ir prie jos pridedamas įvykių klausytojas. Tačiau šį kartą „ Radijui () “ funkcija iškviečiama.
Sukūrus HTML elementą tinklalapyje, atėjo laikas pridėti „ spustelėkite () “ metodas:
< scenarijus >
žymės langelio funkcija ( ) {
document.getElementById ( 'checkbox1' ) .spustelėkite ( ) ;
}
funkcija Radijui ( ) {
document.getElementById ( 'radijo mygtukas' ) .spustelėkite ( ) ;
}
< / scenarijus >
Aukščiau pateiktame kodo fragmente:
- Pirmiausia apibrėžkite dvi „JavaScript“ funkcijas, „ forCheckbox () “ ir „ Radijui () “.
- Šios funkcijos naudoja „ document.getElementById() “ būdas gauti nuorodas į HTML elementus puslapyje su konkrečiais ID „checkbox1“ ir „radioButton“.
- HTML elemento paspaudimo modeliavimui naudojamas click() metodas. Ši funkcija įjungia arba išjungia būseną, kai ji iškviečiama.
Įvykdžius aukščiau nurodytus kodo fragmentus, išvestis atrodo taip:
Aukščiau pateiktas gif iliustruoja, kad žymės langelio ir radijo mygtuko būsena keičiasi naudojant 'click()' metodą.
Išvada
„Click()“ metodas ypač naudingas tvarkant vartotojo sąveiką su tinklalapiu naudojant „JavaScript“.
Užuot pasikliavę tuo, kad vartotojas fiziškai spustelėja elementą, naudokite metodą click(), kad programiškai imituotumėte paspaudimo įvykį. Tai naudinga kuriant interaktyvius ir patogius dizainus. Šis straipsnis sėkmingai parodė DOM elemento „click()“ metodo reikšmę HTML.