javascript核心技术（二十八）jq的标签节点操作(六) 清空源码与清空内容文本

人亦已歌 · 发表于 2023-1-26 13:21:12

上一节我们讲了val、html和text这三个方法分别可以给元素写value，写html、写内容，既然可以写入，当然就可以使用这三个方法实现内容的清空了，这是一种清空方法。
jq还提供了一个专门用作清空的命令：empty。
它既可以清空text也可以清空html。
下面我们来看一下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>清空源码与清空内容文本</title>
    <script src="./jquery.js"></script>
</head>
<body>
    <div id="box">
        <input type="text" id="input_t">
        <span id="span2">这是span2</span>
        <span id="span3">这是span3</span>
        <span id="span4">这是span4</span>
        <span id="span5">这是span5</span>
    </div>
</body>
<script>
    $('#input_t').val('123');
    $('#span2').html('<b>hello</b>');
    $('#span3').text('hello');
    $('#span4').text('<b>hello</b>');

    $('#input_t').val('');//清空value
    $('#span2').html("");//清空html
    $('#span5').text("");//清空text
    $('#span3').empty();//清空的是text
    $('#span4').empty();//清空的是html

</script>
</html>

执行结果如下：

javascript核心技术（二十八）jq的标签节点操作(六) 清空源码与清空内容文本

这部分内容非常简单，大家只需要知道：使用empty可以同时清空html和text，使用val可以清空values即可。

自由天空 · 发表于 2023-2-20 00:36:48

好东西啊

马永明 · 发表于 2023-3-3 17:08:34

成功/对我来说，，成功就是一个新的起点，，什么叫成功，我才刚上路咧引用发哥的话，。无论什么时候，我们都要想的是一个新的起点，这样我们才不会满足现状，目标也会更清晰现在的我自信心越来越膨胀，我感觉有种云里雾里的感觉可能得来太容易了，我发现我太狂了，言不由衷。

hyjzan · 发表于 2023-3-14 06:46:28

谢谢你的经验。非常感谢！

jifeng · 发表于 2023-3-23 16:19:14

感触很深!看来得好好不断学习,充实自己

joncy · 发表于 2023-3-29 00:10:16

天下一绝啊！！！！！！！！！！！好！！！！！！！！！！！！！

yangliu · 发表于 2023-4-3 15:26:42

看来以前所做的努力都和这上面说的错太远了啊。我将来也得走程序员的路，我知道它很苦．至少现在刚开始接触程序的我就已经焦头烂额了，而自己还不知急，整天怨天尤人．读了这篇文章使我收益非浅．让我真正的认清自己．我想起了编程老师为让我们抓紧学习，给我们讲中国软件在世界的地位，美国可以占９０％，１０％是欧洲的，１３亿人口的中国却占不上位置．为什么会这样，我不敢评论，因为自己没资格．我们寝室的同学可能略见一斑，打游戏，每天必修，老师留了个万年历的分组完成程序，我们组十一在学校玩了７天，愣是一个也没有去做的，我自己电脑不能装ＶＣ那是借口，我知即使我装上了ＶＣ我也做不出来，我自己也是１天到晚的游戏啊！自己还想学好Ｃ，这样又怎么学好啊！没毅力，没韧性．坐享天成又怎么可能呢？谢谢您的教导让我如梦初醒！楼主的文章对我启发很大，我也是一个学计算机的本科生，谢谢楼主。