jquery中attr和css方法的区别

jQuery中:

attr()是获取/修改元素的属性(和Html标签有关)。

css()是获取/修改元素的样式属性(和style有关)。

前者可以修改< img >的src属性，可以修改< a >的href属性， 可以修改< input >的title属性。然而后者却不行，他它只能修改样式相关的特征。

所以，后者是前者的子集，只是对 style这个特定的属性进行操作。

eg:

HTML

<div style="color:red;font-weight:bold;" id="a" data-id="1" class="mystyle">Hello</div>

Javascript

<script type="text/javascript">
$(function(){
//css()
var color = $("#a").css("color"); //只有一个参数时，是获取div#a的color，返回red

$("#a").css("color","blue"); //两个参数时,是设置对应的 样式属性，这里是这只文本color为blue
// $("#a").css({"color":"blue","fontWeight":"normal"});//也支持对象形式进行设置样式

//attr()
var id   = $("#a").attr("data-id"); //获取div#a 上面的data-id属性的值；当然，style,class,id这三个都可以获取到，因为这些都是Html元素的 属性
//$("#a").attr("data-id",2);//设置div#a上面的data-id属性为2，假如是一个不存在的属性，使用这个代码，就会添加这个属性到匹配到的元素上面 ，如$("#a").attr("data-width","100px");,使用这个，div#aHtml元素上面就会新增一个data-width的属性
});
</script>