jQuery文本相关操作

最新推荐文章于 2024-07-28 02:30:34 发布

何小白成长笔记

最新推荐文章于 2024-07-28 02:30:34 发布

阅读量111

点赞数

分类专栏： jQuery 文章标签： jquery

本文链接：https://blog.csdn.net/qq_45079626/article/details/105769862

版权

jQuery 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

本文主要探讨jQuery库中用于处理文本内容的各种方法，包括获取、设置和更新DOM元素内的文本信息。

摘要由CSDN通过智能技术生成

jQuery文本相关操作

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="jquery-3.3.1.min.js"></script>
    <title>Document</title>
    <style>
        div{
            height: 100px;
            width: 100px;
            border: 1px solid red;

        }
    </style>
    <script>
        $(function(){
            var btu = document.getElementsByTagName("button");
            
            btu[0].onclick= function(){
                $('div').html("<span>呵呵呵</span>")//设置文本内容
                
            };
            btu[1].onclick = function(){
                console.log($('div').html())//获取文本内容
            }
            btu[2].onclick= function(){
                $('div').text("<span>哈哈哈</span>")//设置text
                
            };
            btu[3].onclick = function(){
                console.log($('div').text())//获取text
            }
            btu[4].onclick= function(){
                $('input').val("<span>嘻嘻</span>")//设置文本内容
                
            };
            btu[5].onclick = function(){
                console.log($('input').val())//获取文本内容,用在input输入框
            }
        })
    </script>
</head>
<body>
    <button>设置html</button>
    <button>获取html</button>
    <button>设置text</button>
    <button>获取text</button>
    <button>设置value</button>
    <button>获取value</button>
    <div></div>
    <input type="text">
</body>
</html>

何小白成长笔记

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery文本相关操作

jQuery文本相关操作<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script ...
复制链接

扫一扫

专栏目录