jQuery属性和样式操作

属性和样式操作

目录

• 属性和样式操作
  • 1 元素属性操作
    • 1.1 属性
    • 1.2 class
    • 1.3 代码、文本、值
  • 2 元素样式操作
    • 2.1 设置CSS
    • 2.2 元素位置
    • 2.3 元素尺寸

1 元素属性操作

1.1 属性

attr(name|pro|key,val|fn)   设置或返回被选元素的属性值
removeAttr(name)            从每一个匹配的元素中删除一个属性
prop(n|p|k,v|f)             获取在匹配的元素集中的第一个元素的属性值
removeProp(name)            用来删除由.prop()方法设置的属性集

1.2 class

addClass(class|fn)          为每个匹配的元素添加指定的类名
removeClass([class|fn])     从所有匹配的元素中删除全部或者指定的类
toggleClass(class|fn[,sw])  如果存在（不存在）就删除（添加）一个类
hasClass(class)             检查当前的元素是否含有某个特定的类，如果有，则返回true

1.3 代码、文本、值

html([val|fn])      取得第一个匹配元素的html内容
text([val|fn])      取得所有匹配元素的内容
val([val|fn|arr])   获得匹配元素的当前值

2 元素样式操作

2.1 设置CSS

css(name|pro|[,val|fn])     访问匹配元素的样式属性

2.2 元素位置

offset()        获取匹配元素在当前视口的相对偏移
position()      获取匹配元素相对父元素的偏移
scrollLeft()    获取匹配元素相对滚动条顶部的偏移
scrollTop()     获取匹配元素相对滚动条左侧的偏移

2.3 元素尺寸

widht()         取得第一个匹配元素当前计算的宽度值（px）
height()        取得匹配元素当前计算的高度值（px)
innerWidth()    匹配元素内部区域宽度（包括补白、不包括边框）
innerHeight()   匹配元素内部区域高度（包括补白、不包括边框）
outerWidth()    匹配元素外部宽度（默认包括补白和边框）
outerHeight()   匹配元素外部高度（默认包括补白和边框）