GetAttribute 获取属性值
简介
获取节点对象的某个属性以及属性值是JavaScript开发中常见的操作,原生js的某些方法并不能通用,比如通过dom.style并不能获取节点对象的真正样式属性(事实上只有节点对象写上style="width:100px"才可以),我们需要有统一的方法去获取节点对象的所有样式属性值。
axStyle
该函数可获取某节点对象的某属性值,返回节点元素的style对象。
完整写法:axStyle(elem, pseudo),参数说明如下:
- elem:可以填"#id"、".className"、"div"等原生选择器以及Dom对象。
- pseudo:选填项,可以是":before"、":after"或null。如果想获得节点元素的伪类属性值可以填写。
举例:axStyle('#demo').fontSize,该例子是获取#demo节点的font-size属性值。
axOffset
该函数可获取距离body的上偏移量和左偏移量。
完整写法:axOffset(elem),参数说明如下:
- elem:可以填"#id"、".className"、"div"等原生选择器以及Dom对象
举例:axOffset('#demo').left,该例子可获取#demo节点元素距离body的左偏移量;另外还有axOffset('#demo').top
axWidth
该函数可获得节点元素的真实占用宽度。
完整写法:axWidth(elem, type),可简写axWidth(elem),参数说明如下:
- elem:可以填"#id"、".className"、"div"等原生选择器以及Dom对象。
- type:可选项,可选择inner或outer,默认是inner。如果是inner则除了width还包含padding-left和padding-right;如果是outer则再包含border-width、margin-left和margin-right。
举例:axWidth('#demo', 'outer'),该例子返回#demo节点“width + padding-left + padding-right + border-width + margin-left + margin-right”的值。
axHeight
该函数可获得节点元素的真实占用宽度。
完整写法:axHeight(elem, type),可简写axHeight(elem),参数说明如下:
- elem:可以填"#id"、".className"、"div"等原生选择器以及Dom对象。
- type:可选项,可选择inner或outer,默认是inner。如果是inner则除了height还包含padding-top和padding-bottom;如果是outer则再包含border-width、margin-top和margin-bottom。
举例:axHeight('#demo', 'outer'),该例子返回#demo节点“height + padding-top + padding-bottom + border-width + margin-top + margin-bottom”的值。
axArrHeight
该函数可获得节点元素导致形成高度的构成部分。
完整写法:axArrHeight(elem),参数说明如下:
- elem:可以填"#id"、".className"、"div"等原生选择器以及Dom对象,elem必须是ul节点对象
举例:axArrHeight('#demo').height,该例子放回#demo节点的height值,其他的还有paddingTop、paddingBottom、marginTop、marginBottom、borderTop、borderBottom