Ang artikulong ito ay maikli na nagpapakita kung ano ang DOM Element na 'click()' na Paraan at kung paano ito gamitin sa HTML?
Ano ang Pamamaraan na 'click()' ng DOM Element sa HTML?
Kapag ang click() na paraan ay tinawag sa isang HTML na elemento, ginagaya nito ang isang user na nagki-click sa elemento gamit ang mouse, na kung saan ay nagti-trigger ng anumang naka-attach na mga handler ng kaganapan. Nagbibigay-daan ito sa mga developer na magsagawa ng ilang interactive na pagkilos gaya ng pagbubukas ng mga link, pagsusumite ng mga form, o pag-toggle sa visibility ng mga elemento nang hindi nangangailangan ng pisikal na pag-click ng mouse. Nakakatulong ito upang lumikha ng interactive at tumutugon na mga web page.
Paano Gamitin ang Pamamaraan na 'click()' ng DOM Element sa HTML?
Upang magamit ang click() na paraan, kailangan muna ng mga user na kumuha ng reference sa HTML element upang gayahin ang isang click-on. Magagawa ito gamit ang alinman sa karaniwang DOM traversal o mga pamamaraan ng query, tulad ng ' getElementById ”, “ getElementsByClassName ”, “ querySelector ”, o “ querySelectorAll ”.
Maglakad tayo sa isang halimbawa para sa isang mas mahusay na paliwanag ng 'click()' na paraan.
Halimbawa: HTML Checkbox at Radio Button Elements
Ang isang halimbawa ay isinasaalang-alang kung saan ang ' click() Ang paraan ay ginagamit kasama ang HTML checkbox at mga elemento ng radio button. Sundin ang code sa ibaba:
< anyo >
< input
uri = 'checkbox'
id = 'checkbox1'
onmouseover = 'para saCheckbox()'
>
Pinapatakbo ng Linuxhint
< input
uri = 'radyo'
id = 'radioButton'
onmouseover = 'para saRadio()'
>
Pinapatakbo ng Linuxhint
< / anyo >
Sa snippet ng code sa itaas:
- Una, ang isang checkbox ay ginawa sa webpage sa pamamagitan ng paggamit ng tag na may uri na nakatakda sa ' checkbox ”.
- Pagkatapos nito, ang tagapakinig ng kaganapan ' onmouseover ' ay naka-attach sa checkbox at hinihimok ang ' para saCheckbox() ” function.
- Sa parehong paraan, ang ' radyo Ang pindutan ay nilikha gamit ang ' ” tag, at ang tagapakinig ng kaganapan ay naka-attach dito. Ngunit sa pagkakataong ito, ang ' forRadio() ” function ay ginagamit.
Matapos ang paglikha ng isang HTML na elemento sa webpage, ngayon ay oras na upang idagdag ang ' click() 'paraan:
< iskrip >
function para sa Checkbox ( ) {
document.getElementById ( 'checkbox1' ) .click ( ) ;
}
function para sa Radyo ( ) {
document.getElementById ( 'radioButton' ) .click ( ) ;
}
< / iskrip >
Sa snippet ng code sa itaas:
- Una, tukuyin ang dalawang function ng JavaScript, ' para saCheckbox() 'at' forRadio() ”.
- Ang mga function na ito ay gumagamit ng ' document.getElementById() ” paraan upang makakuha ng mga sanggunian sa mga elemento ng HTML sa page na may mga partikular na id na “checkbox1” at “radioButton”.
- Para sa simulation ng pag-click sa HTML element, ang click() na paraan ay ginagamit. I-toggle ng function na ito ang estado ng on o off kapag ito ay tinawag.
Pagkatapos ng pagpapatupad ng mga snippet ng code sa itaas, ang output ay lalabas na ganito:
Ang gif sa itaas ay naglalarawan na ang katayuan ng checkbox at ang radio button ay nagbabago gamit ang 'click()' na paraan.
Konklusyon
Ang click() na paraan ay partikular na kapaki-pakinabang para sa paghawak ng mga pakikipag-ugnayan ng user sa isang web page sa pamamagitan ng JavaScript.
Sa halip na umasa sa user na pisikal na mag-click sa elemento, gamitin ang click() na paraan upang gayahin ang kaganapan ng pag-click sa programmatically. Ito ay kapaki-pakinabang para sa paglikha ng mga interactive at user-friendly na mga disenyo. Matagumpay na naipakita ng artikulong ito ang kahulugan ng DOM element na 'click()' na paraan sa HTML.