Jquery学习4-2---jquery用法之访问dom对象属性。

 

第一：attr(name);

       此方法获取jquery对象中第一个元素的对应属性名的属性值。

       例子：

              <a href="www.google.com" id="a1" class="a1">

<a href="www.baidu.com" id="href" class="lll" ></a>

<script language="javascript" type="text/javascript">

       var href = $("a").attr("href");

       alert(href);

</script>

       测试结果就是弹出提示，内容为www.google.com

第二：attr(key,value);

       此方法用来设置dom元素的属性的属性值。比如设置图片1.jpg的宽度为200px

       <img src="imgage/1.jpg" />

<script language="javascript" type="text/javascript">

       var img = $("img");

       img.attr("width","200px");

</script>

此时图片就会以宽度200像素的大小显示在页面中。

 

第三：attr(key,fn);

       此函数可以用来设置dom元素的属性的属性值，但属性值不是一个值，而是一个函数，此函数返回的值作为该属性的属性值。

       <img src="imgage/1.jpg" name="test" />

      <script language="javascript" type="text/javascript">

       var img = $("img");

       img.attr("title",function(){

              return this.name;

       });

    </script>

当将鼠标放到图片上时，显示title的属性值test

第四：attr(properties);为jquery对象同时定义多个属性，多个属性间以名/值对的形式组成一个对象进行传递。

              例子：同时设置图片的宽、高、提示文本等。

      <img src="imgage/1.jpg" name="test" alt="sdf" />

     <script language="javascript" type="text/javascript">

       var img = $("img");

       img.attr({width:"300",height:"200",title:"这是一个图片",alt:"更改了图像的title"});

     </script>

第五：removeAttr(name);

       此方法作用是移除jquery对象内的属性以及属性值。

   

    <img src="imgage/1.jpg" width="375" height="245" border="1" />

    <script language="javascript" type="text/javascript">

       var img = $("img");

       img.removeAttr("border");

    </script>

这样图片的边框就没有了。