• jQuery学习之------对标签属性的操作


     jQuery学习之------标签的属性

    <a href=””>链接</a>此处的href就是该a标签带有的属性

    在js中对标签的属性的操作方法有

    1.1getAttribute()方法 ----获取元素的属性

             例子:

    <a href="www.soulsjie.com" id="jie">jie</a>

         <script>

             var aa=document.getElementById("jie").getAttribute("href");

    //获取id为jie的元素的href属性的值赋值给变量aa,之后将aa打印

             document.write(aa);

         </script>

    1.2setAttribute()方法----设置元素的属性

      例子:

    <a href="" id="jie">jie</a>
         <script>
             document.getElementById("jie").setAttribute("href","https://soulsjie.com");
    // 给元素设置属性值   

    </script>

    1.3removeAttribute()方法---移除元素的属性

    <a href="" id="jie">jie</a>
         <script>
             document.getElementById("jie").removeAttribute("href");

    //移除元素的属性 
         </script>

    在jQuery中attr()与removeAttr()可以对元素的属性进行操作,并解决兼容问题

    attr()有4个表达式

    attr(传入属性名):获取属性的值

    attr(属性名, 属性值):设置属性的值

    <script type="text/javascript">

      //获取最后一个input的value属性值
          var ss=$("input :last").attr('value');
            //给第一个input的value属性赋新的值
            $("input :first").attr('value','我是新的内容')
    </script>

     attr(属性名,函数值):设置属性的函数值

    attr(属性名,函数值)

        <script type="text/javascript">
            //找到第三个input,通过使用一个函数来设置属性
            $("input:eq(2)").attr('value',function(){
                return 1+1;
            })
        </script>

    attr(attributes):给指定元素设置多个属性值,即:{属性名一: “属性值一” , 属性名二: “属性值二” , … … }

      <script type="text/javascript">

           //找到第三个input,同时给元素设置多个属性
            $("input:eq(2)").attr({type: "button",value: "jianhua"})
        </script>

    removeAttr()删除方法

    .removeAttr( attributeName ) : 为匹配的元素集合中的每个元素中移除一个属性(attribute)

    <script type="text/javascript">
            //找到第四个input,通过使用removeAttr删除属性
            $("input:eq(3)").removeAttr('value')
        </script>

  • 相关阅读:
    SPOJ1007 VLATTICE
    hdu 4746Mophues[莫比乌斯反演]
    [Offer收割]编程练习赛13 B.最大子矩阵[枚举]
    [SCOI2011]飞镖[数学模拟]
    2333: [SCOI2011]棘手的操作[离线线段树]
    hdu3507 Print Article[斜率优化dp入门题]
    react 日期
    使用arc进行code review
    css冲突2 要关闭的css在项目代码以外,但是是通过<link>标签引入的css(例如bootstrap):解决方法,在APP.css中使用全局样式
    <svg>标签
  • 原文地址:https://www.cnblogs.com/soulsjie/p/7782967.html
Copyright © 2020-2023  润新知