Rumah > Artikel > hujung hadapan web > 怎么用jquery实现点击改变文本
怎么用jquery实现点击改变文本
- 青灯夜游asal
- 2022-05-13 18:13:193096semak imbas
实现方法：1、用“$("button").click(function(){})”语句，给按钮元素绑定点击事件，并设置事件处理函数；2、在处理函数中，设置“元素对象.text("新文本")”或“对象.html("新文本")”语句来修改文本。
本教程操作环境：windows7系统、jquery3.2.1版本、Dell G3电脑。
用jquery实现点击改变文本
1、设置点击事件
利用click()给按钮元素绑定点击事件，并设置事件处理函数
<!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、在事件处理函数中，使用text()或html()修改指定元素的文本内容
text() 方法设置或返回被选元素的文本内容。
html() 方法设置或返回被选元素的内容（innerHTML）。
$(document).ready(function() {
$("button").click(function() {
$("p").text("Hello world!");
});
});
$(document).ready(function() {
$("button").click(function() {
$("p").html("Hello!");
});
});
说明：
html() 获取的是元素内部所有的内容，而 text() 获取的仅仅是文本内容
html()可设置包含标签的内容，而 text() 只能设置文本内容（不包含标签）。
$(document).ready(function() {
$("button").click(function() {
$("p").html("Hello <b>world!</b>");
});
});
【推荐学习：jQuery视频教程、web前端视频】
Atas ialah kandungan terperinci 怎么用jquery实现点击改变文本. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：jquery怎么增加和删除属性Artikel seterusnya：jquery怎么查询最后一个子元素