jQuery的attr()与css()对比

首先要区分下样式和属性

属性：我们通常将id,src,alt,class，href称为属性,也即元素属性.

样式：width，color，font-size，display 等

 

 

 

jquery中有attr()和css()两种方法

①attr()主要是针对元素的属性进行操作

 

②css()修改的是样式里面的属性，两者的侧重点不同

 

①attr()主要是针对元素的属性进行操作，如img的src属性和alt属性，a链接的href属性等等;

②css()修改的是样式里面的属性，即是style里面的属性

 

拓展：

1 如果想要通过attr()获取属性值，那么该属性必须显式的设置在HTML代码中或者通过attr新增的属性才能被获取到，如果没有设置，那么将返回undefined 

2 如果通过prop（）获取属性值，那么该属性只能是HTMl的固有属性，无论是否显式的设置，都可以获取其对应的属性值，如果是额外增加的属性，那么将无法获取。下面来说这个问题

拓展2：

1 属性的定义，根据W3C手册所述：属性包括，标准属性：id class style title 语言属性 lang dir以及某些特定的元素的固有的属性，比如 a 的 href target 属性，input元素的 radio checked type alt src disabled value 等 ，img标签的width height src alt 等，不存在的属性叫做新增属性。 
2 attr( ) 可以设置元素的属性（也就是给元素新增加一个原来并不存在的属性）也可以获取元素的本来就有的属性以及额外设置的属性。如果要获取的属性没有设置，那么获取到的结果是 undefined; 
3 prop( )可以设置元素的属性（HTML固有的属性，可以给元素添加属性）也可以获取元素的固有的属性值，如果是额外设置的其他属性，则无法通过prop（ ）获取。 
4 设置元素属性： 
attr （“属性名”，“属性值”） 既可以设置元素固有的属性，也可以设置元素本来不存在的属性，比如attr（）可以给下面代码div行设置固有的HTML属性，包括 ttle id class 等，也可以设置原先不存在的属性，也就是造一个新的属性，比如 index aaa 等，任何都行；而 prop( “属性名”，“属性值”)只能设置固有的HTML属性。 
获取元素属性值： 
attr(“属性值“）只能获取已经设置在元素身体上的属性值，包括固有属性和新增属性，没有设置的属性将无法获取到值，结果全部是undefined; 
prop(“属性值”） 只能获取固有属性的属性值，新增属性的属性值无法被获取到。