Jquery操作文本内容(三个方法：html()、text()、var())
一、html()获取和设置文本内容和标签
1、获取标签里的结构和内容
$("ul").html() //获取标签里所有的结构和内容
2、设置标签里的文本内容
$(".a").html("你好，世界") //设置标签里的id是a里的文本内容$("li").html("<span>你好，世界<span>") //设置标签是li为span标签并加上相应内容
3、html()实例
<!--
html获取标签里的文本和标签
等价原生JS中的innerHTML
格式：$("标签").html()设置标签里的文内容
格式：$("标签").html("内容或标签")
-->
<html>//导入jQuery
<script src="jquery-3.6.0.min.js"></script>
<body><ul><li class="a">12</li><li>34</li><li>4</li> </ul>
<script>//获取元素标签里所有的结构，以字符串方式返回var sen=$("ul").html()console.log(sen)//设置标签里的内容$(".a").html("我是第一个li标签里的内容") $("li").html("<span>全部li变成了span标签<span>")</script>
</body>
</html>
二、 text()获取和设置文本
1、获取标签里的文本内容
$("ul").text() //获取标签里所有的文本内容
2、设置标签里的文本内容
$("ul").text("你好，世界") //获取标签里所有的文本内容
3、text实例
<!--
html获取标签里的文本
等价原生JS中的innerText
格式：$("标签").text()设置标签里的文内容
格式：$("标签").text("文本内容")
-->
<html>//导入jQuery
<script src="jquery-3.6.0.min.js"></script>
<body><ul><li class="a">12</li><li>34</li><li>4</li> </ul>
<script>//获取元素标签里所有的文本，以字符串方式返回var sen=$("ul").text()console.log(sen)//设置标签里的文本内容$(".a").text("我是第一个li标签里的内容") //其中的<span>标签不起作用，只能被识别成普通文本$("li").text("<span>全部li变成了span标签<span>") </script>
</body>
</html>
三、val主要获取设置表单元素
1、获取表单里的内容
$("input").val() //获取input标签里的文本内容
2、设置表单里的文本内容
$("input").val("你好，世界") //设置input标签里的文本内容
3、val()实例
<!--
val获取标签里的文本
等价原生JS中的value
格式：$("标签").val()设置标签里的文内容
格式：$("标签").val("文本内容")
--><html>//导入jQuery
<script src="jquery-3.6.0.min.js"></script>
<body><form><inpt type="text" value="123"></form><script>//获取元素标签里所有的文本，返回123var sen=$("input").val()console.log(sen)//设置表单里的内容$("input").val("我是文本框里的新内容") </script>
</body>
</html>
