recherche

Maison >interface Web >js tutoriel >Comment cliquer sur un bouton pour modifier le texte avec JavaScript

Comment cliquer sur un bouton pour modifier le texte avec JavaScript

青灯夜游
青灯夜游original
2022-01-19 10:45:4110014parcourir

Comment modifier le texte en cliquant sur un bouton en JavaScript : 1. Créez un élément de bouton, utilisez l'attribut onclick pour lier l'événement de clic et définissez la fonction de traitement d'événement ; 2. Dans la fonction de traitement d'événement, utilisez "objet élément. L'instruction innerHTML="modified Text content ";" peut modifier le contenu textuel de l'élément.

Comment cliquer sur un bouton pour modifier le texte avec JavaScript

L'environnement d'exploitation de ce tutoriel : système Windows 7, JavaScript version 1.8.5, ordinateur Dell G3.

JavaScript clique sur le bouton pour modifier le texte

Idée d'implémentation :

  • Créez un élément de bouton, utilisez l'attribut onclick pour lier l'événement de clic et définissez la fonction de traitement d'événement ; la fonction de traitement d'événements, utilisez L'attribut innerHTML modifie le contenu textuel de l'élément.

  • Code d'implémentation : 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
	</head>
	<body>
		<p id="con">默认文本内容</p>
		<button onclick="myFunction()">点击按钮修改文本内容</button>
		<script>
			function myFunction() {
				var p=document.getElementById("con");
				p.innerHTML="修改后的文本内容";
			}
		</script>
	</body>
</html>

[Recommandations associées :

Tutoriel d'apprentissage javascriptComment cliquer sur un bouton pour modifier le texte avec JavaScript

]

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!

JavaScript 对象 事件 innerHTML
Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Une brève analyse de la façon d'utiliser la bibliothèque Puppeteer pour générer des affiches dans Node (partage du plan de mise en œuvre)Article suivant：Une brève analyse de la façon d'utiliser la bibliothèque Puppeteer pour générer des affiches dans Node (partage du plan de mise en œuvre)

Articles Liés

Voir plus