Heim > Artikel > Web-Frontend > So verwenden Sie JQuery, um Text beim Klicken zu ändern

So verwenden Sie JQuery, um Text beim Klicken zu ändern

青灯夜游Original: 2022-05-13 18:13:193167Durchsuche

Implementierungsmethode: 1. Verwenden Sie die Anweisung „$(“button“).click(function(){})“, um das Klickereignis an das Schaltflächenelement zu binden und die Ereignisverarbeitungsfunktion festzulegen. 2. In der Verarbeitungsfunktion; Setzen Sie die Anweisung „Element object.text(“new text“)“ oder „object.html(“new text“)“, um den Text zu ändern.

Die Betriebsumgebung dieses Tutorials: Windows7-System, JQuery3.2.1-Version, Dell G3-Computer.

Verwenden Sie JQuery, um den Text beim Klicken zu ändern

1. Legen Sie das Klickereignis fest

Verwenden Sie click(), um das Klickereignis an das Schaltflächenelement zu binden und die Ereignisverarbeitungsfunktion festzulegen

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.2.1.min.js"></script>
		<script>
			$(document).ready(function() {
				$("button").click(function() {
					//点击事件发生后，执行的代码
				});
			});
		</script>
	</head>
	<body>

		<button>修改所有p元素的文本内容</button>
		<p>这是一个段落。</p>
		<p>这是另一个段落。</p>

	</body>
</html>

2. Verwenden Sie in der Ereignisverarbeitungsfunktion text() oder html(), um den Textinhalt des angegebenen Elements zu ändern. Die Methode text() legt den Textinhalt des ausgewählten Elements fest oder gibt ihn zurück. Die Methode

html() legt den Inhalt (innerHTML) des ausgewählten Elements fest oder gibt ihn zurück.

$(document).ready(function() {
	$("button").click(function() {
		$("p").text("Hello world!");
	});
});

$(document).ready(function() {
	$("button").click(function() {
		$("p").html("Hello!");
	});
});

So verwenden Sie JQuery, um Text beim Klicken zu ändern

Erklärung:

So verwenden Sie JQuery, um Text beim Klicken zu ändern

html() ruft den gesamten Inhalt innerhalb des Elements ab, während text() nur den Textinhalt abruft.

html() kann so eingestellt werden, dass es Tag-Inhalte einschließt , während text() nur Textinhalte festlegen kann (ohne Beschriftungen).

$(document).ready(function() {
	$("button").click(function() {
		$("p").html("Hello <b>world!</b>");
	});
});

【Empfohlenes Lernen:

jQuery-Video-Tutorial

, So verwenden Sie JQuery, um Text beim Klicken zu ändern Web-Frontend-Video

】

Das obige ist der detaillierte Inhalt vonSo verwenden Sie JQuery, um Text beim Klicken zu ändern. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

jquery html function 对象事件 innerHTML

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：So fügen Sie Attribute in JQuery hinzu und löschen sieNächster Artikel：So fügen Sie Attribute in JQuery hinzu und löschen sie

In Verbindung stehende Artikel

Mehr sehen