Vývojáři většinou chtějí, aby jejich webové stránky byly atraktivní a aby byly interaktivní. Za tímto účelem jsou na webovou stránku přidána tlačítka. Například, když je potřeba odesílat nebo přijímat data, včetně událostí kliknutí pro přidané funkce pro uživatele při registraci nebo přihlašování k účtu. V takových případech tlačítka umožňují koncovému uživateli chytře provádět různé funkce.
Tento blog vysvětlí metody vytváření tlačítek v JavaScriptu.
Jak vytvořit tlačítko v JavaScriptu?
K vytvoření tlačítka v JavaScriptu lze použít následující metody:
Následující přístupy budou demonstrovat koncept jeden po druhém!
Metoda 1: Vytvořte tlačítko v JavaScriptu pomocí metod „createElement()“ a „appendChild()“
' createElement() “ metoda vytvoří prvek a “ appendChild() ” metoda připojí prvek k poslednímu potomkovi prvku. Tyto metody budou použity pro vytvoření tlačítka a jeho připojení k modelu objektu dokumentu (DOM), který je třeba použít, resp.
Syntax
dokument. createElement ( typ )živel. appendChild ( uzel )
Ve výše uvedené syntaxi „ typ “ označuje typ prvku, který bude vytvořen pomocí metody createElement() a „ uzel ” je uzel, který bude připojen pomocí metody appendChild().
Následující příklad objasní uvedený koncept.
Příklad
Za prvé, „ knoflík ” bude vytvořena pomocí metody document.createElement() a uložena do proměnné s názvem “ createButton “:
konst createButton = dokument. createElement ( 'knoflík' )Dále, „ vnitřníText Vlastnost ” bude odkazovat na vytvořené tlačítko a nastaví textovou hodnotu zadaného tlačítka následovně:
createButton. vnitřníText = 'Klikni na mě'Konečně, „ appendChild() ” metoda připojí vytvořené tlačítko k DOM odkazem na proměnnou, ve které je uloženo, jako argument:
dokument. tělo . appendChild ( createButton ) ;Výsledkem výše uvedené implementace bude následující:
Metoda 2: Vytvořte tlačítko v JavaScriptu pomocí atributu „Type“ tagu „input“.
' typ ” představuje typ vstupního prvku, který se má zobrazit. Lze jej použít k vytvoření tlačítka zadáním „ knoflík ” jako hodnotu atributu type vstupní značky.
Syntax
< Typ vstupu = 'knoflík' >Tady, ' knoflík ” označuje typ vstupního pole.
Podívejte se na níže uvedený příklad.
Příklad
Nejprve použijeme vstupní značku, její typ specifikujeme jako „ knoflík “ a hodnotu jako „ Klikni na mě “. V důsledku toho se vytvoří tlačítko. Navíc to spustí „ createButton() Funkce ” po kliknutí:
< Typ vstupu = hodnotu tlačítka = Click_Me onclick = 'createButton()' >V souboru JavaScript definujeme „ createButton() ” funkce, která po kliknutí na přidané tlačítko vygeneruje výstražné pole:
funkce createButton ( ) {upozornění ( 'Toto je tlačítko' )
}
Výstup
Diskutované techniky pro vytvoření tlačítka v JavaScriptu lze vhodně využít podle požadavků.
Závěr
Chcete-li vytvořit tlačítko v JavaScriptu, “ createElement() ' a ' appendChild() ” metody lze použít pro vytvoření tlačítka a jeho připojení k použití v DOM. Další technika, kterou lze použít k vytvoření tlačítka, je definování typu vstupu a přidání souvisejících funkcí. Tento článek demonstroval metody vytvoření tlačítka v JavaScriptu.