jQuery设置获取文本内容text()

2022-08-01 00:32:45 阅读：141 来源： 互联网

<!--@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>

标签：jQuery,text,获取,设置,标签,文本,div1
来源： https://www.cnblogs.com/beyondx/p/16538717.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

jQuery设置获取文本内容text()