• (19)jQuery操作文本和属性


    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>jq操作文本和操作属性</title>
    </head>
    <body>
    <div class="box">box</div>
    <input class="inp" type="text">
    <button class="btn">打印输入的内容</button>
    <button class="getImg">获取图片</button>
    <img class="img" src="" alt="">
    </body>
    <script src="js/jq.js"></script>
    <script>
    //jq获取文本
    var txt = $('.box').text();
    console.log(txt)

    //修改纯文本
    $('.box').text('这里填写需要修改的文本');

    //设置html类型文本,直接修改标签类型
    $('.box').html('<b>这样写就是修改标签的类型</b>>')

    //input框
    $('.btn').click(function () {
    //获取input框的内容并打印,打印框内没有内容就输出空
    var v = $('.inp').val(); //val就是获取,val不给值就是获取,给值就是赋值
    console.log(v);
    //打印框的内容置空(用户在输入框中输入内容,点击按钮后提交内容后将输入框内容清除),直接赋值一个空内容即可
    $('.inp').val("");
    })

    //操作属性
    //img标签的内容属于资源,既不是text,也不是value,而是src
    //操作按钮显示图片和隐藏图片
    $('.getImg').click(function () {
    //先获取img标签下sc的值
    var src = $('img').attr('src');
    if (src){
    $('.img').attr('src',''); //如果有值就设置为空
    }else{
    //对img标签的src进行赋值
    $('.img').attr('src','http://scimg.jb51.net/allimg/150803/14-150P315312YB.jpg') //attr就是操作全局属性,如果只有一个src就是获取原来的src,然后再给一个值就是设置赋值
    }
    })


    </script>
    </html>
  • 相关阅读:
    带颜色的输出
    排序默写最后一遍
    树形图查找与纯函数默写第二遍
    查找树形结构的某对象
    纯函数&根据id在树形结构中查找
    Docker搭建私有仓库harbor的搭建与使用
    有 react fiber后,为什么不需要 "vue fiber" ?
    前端开发git使用随笔(搭配VSCode使用
    谷歌浏览器打断点调试方法
    地平线5获取Eventlab赛事时发生错误,请稍后再试。
  • 原文地址:https://www.cnblogs.com/shizhengquan/p/10440018.html
Copyright © 2020-2023  润新知