Maison > Article > interface Web > Comment obtenir et modifier les données de la zone de texte d'entrée à l'aide de JS
Cette fois, je vais vous montrer comment utiliser JS pour obtenir et modifier les données de la zone de texte de saisie. Quelles sont les précautions pour utiliser JS pour obtenir et modifier les données de la zone de texte de saisie. cas pratique. Jetons un coup d'oeil.
1 Introduction
Obtenir la zone de texte et modifier son contenu peut être réalisé en utilisant la méthode getElementById()
. La méthode
getElementById()
peut obtenir la balise HTML par l'identifiant spécifié et la renvoyer.
Syntaxe :
sElement=<a href="http://www.php.cn/code/658.html" target="_blank ">document<code>sElement=<a href="http://www.php.cn/code/658.html" target="_blank">document</a>.getElementById(id)
.getElementById(id)
sElement : utilisé pour recevoir un objet renvoyé par cette méthode.
id : utilisé pour définir la valeur de l'identifiant qui doit être obtenue à partir de la balise HTML.
Deuxième application
Récupérez la zone de texte et modifiez son contenu
sera affiché dans la zone de texte après la page est chargé "Contenu du texte initial", le contenu de la zone de texte sera modifié lorsque vous cliquerez sur le bouton.
Trois codes
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>获取文本框并修改其内容</title> </head> <body> <script language="javascript"> <!-- function c1() { var t=document.getElementById("txt"); t.value="www.jb51.net 修改文本内容" } --> </script> <input type="text" id="txt" value="初始文本内容" size="30"/> <input type="button" value="更改文本内容" name="btn" onclick="c1();" /> </body> </html>
Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez. faites attention à d'autres questions connexes dans l'article du site Web chinois php !
Lecture recommandée :
Comment utiliser les composants d'ordre supérieur de React
Comment résoudre correctement les problèmes inter-domaines dans Projets Vue
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!