Element对象 常用属性与常用方法
常用属性
.children
子元素列表.childElementCount
子元素数量.firstElementChild
第一个子元素.lastElementChild
最后一个子元素.classList
类名列表(对象).className
类名(字符串).id
元素id.attributes
所有显性属性.innerHTML
元素内部的HTML标记.outerHTML
包含元素在内的HTML标记.clientWidth
内容区 + padding的宽度.clientHeight
内容区 + padding的高度.scrollHeight
元素中可以滚动的高度.scrollWidth
元素中可以滚动的宽度.scrollTop
元素中的内容已经向上滚出去多少.scrollLeft
元素中的内容已经向左滚出去多少
常用方法
.getAttribute(属性名)
获取属性的值.setAttribute(属性名,属性值)
获取属性的值.getAttributeNames()
列出所有属性.hasAttribute(属性名)
是否拥有属性.hasAttributes()
是否拥有至少一条属性.removeAttribute(属性名)
删除一条属性.addEventListener(事件名称,回调函数)
监听一个事件.getElementById(id)
在当前元素下通过id获取元素.getElementsByClassName(class)
在当前元素下通过class获取元素.getElementsByTagName(标签名)
在当前元素下通过元素名称获取元素.querySelector(选择器)
在当前元素下通过CSS选择器来获取一个元素.querySelectorAll(选择器)
在当前元素下通过CSS选择器来获取多个元素-
FAQ
attribute
和property
有什么区别?我们都知道HTML标签可以填写属性
<a href="http://biaoyansu.com" id="biao">表</a>
此处的
href
是attribute(显性属性)var biao = document.getElementById('biao');
biao.href
中的.href
是property(隐性属性)注意,property和attribute的名称不一定是一模一样的。