一、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> //获取元素标签里所有的文本，返回123 var sen=$("input").val() console.log(sen) //设置表单里的内容 $("input").val("我是文本框里的新内容") </script> </body> </html>
