<!--@description-->
<!--@author beyondx-->
<!--@date Created in 2022/07/31/ 23:44-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>设置获取文本内容text()</title>
</head>
<body>
<input type="button" value="获取" id="getBtn"/>
<input type="button" value="设置" id="setBtn"/>
<div id="div1">我是一个div1标签
<p>我是一个p1标签</p>
<span>span1</span>
</div>
<div>我是一个div2标签
<p>我是一个p2标签</p>
<span>span2</span>
</div>
<script src="jquery-1.12.4.js"></script>
<script>
// 入口函数
$(function () {
// text(): 获取和设置文本
// 1.获取文本: text()方法不给参数
$('#getBtn').click(function () {
// 1.1. 获取 id为 div1这个标签的文本
// 会获取到 这个标签中 所有的文本, 包括 后代元素的文本
console.log($('#div1').text());
// 1.2. 获取标签为 div的 元素的文本
// 包含了 多个 dom元素的 jQuery对象, 通过 text()方法获取 文本, 会把所有 dom元素的 文本获取到
console.log($('div').text());
});
// 2. 设置文本
$('#setBtn').click(function () {
// // 给id 为 div1的这个标签 设置文本
// $('#div1').text('我是新设置的文本');
// // 标签 不会解析出来, 会当做 文本显示
// $('#div1').text('我是新设置的文本<a>我是链接</a>');
// 2.2. 给标签为 div的元素 设置文本
// 包含了 多个 dom元素 的 jQuery对象, 通过 text()方法 设置文本, 会把 所有的 dom元素 都设置上
// 隐式遍历/隐式迭代; 遍历出 每个dom对象, 设置上 文本.
$('div').text('设置的文本');
});
});
</script>
</body>
</html>
