获取页面中元素方法
document.getElementById()
context.getElementsByTagName(tagname):把指定容器中子子孙孙的所有标签名为tagname的都获取到了
context.getElementByClassName(classname):在IE6-8下不兼容
document.getElementByName():在IE浏览器中只对表单元素的name起作用
document.body
document.documentElement
context.querySelector/context.querySelectorAll:通过选择器来获取元素,在IE6-8下不兼容。通过这个获取的节点集合不存在DOM映射
描述节点和节点之间关系的属性(在标准浏览器中会把空格和换行当做文本节点处理)
childNodes:获取所有的子节点
children:获取所有的元素子节点。在IE6-8下获取的结果和标准浏览器获取的结果不一致
parentNode:获取父亲节点
previousSibling/previousElementSibling:获取上一个兄弟(哥哥)/(元素)节点
nextSibling/nextElementSibling:获取下一个兄弟(弟弟)/(元素)节点
firstChild/firstElementChild:获取所有子节点中的第一个(大儿子)(或元素)节点
lastChild/lastElementChild:获取所有子节点中的最后一个(小儿子)(或元素)节点
所有带Element的在IE6-8下都不兼容
DOM的增删改
createElement
document.createDocumentFragment()
appendChild
insertBefore
cloneNode(true/false)
replaceChild
removeChild
get/set/removeAttribute
DOM盒子模型
client系列
offset系列
scroll系列
getComputedStyle/currentStyle
以下方法和jquery中的作用和方法名一样
1、function children:获取某一个容器中所有的元素子节点(还可以筛选出指定标签名的)
2、getElementsByClass:通过元素的样式类名获取一组元素(兼容所有浏览器)(jquery中没有这个方法名,但jquery的一部分选择器是基于这个方法的原理实现的)
3、获取元素节点:获取上一个哥哥元素节点(prev)、获取下一个弟弟元素节点(next)、获取所有哥哥元素节点(prevAll)、获取所有的弟弟元素节点(nextAll)、获取相邻的两个元素节点(sibling)、获取所有的兄弟元素节点(siblings)、获取第一个元素子节点(firstChild)、获取最后一个元素子节点(lastChild)
(最后两个方法jquery中也没有)
index:获取当前元素的索引
4、增删改中:
prepend:和appendChild对应,增加到某一个容器的开头
insertAfter:和insertBefore对应,增加到容器中某一个元素后面
addClass:增加样式类名
removeClass:删除样式类名
hasClass:判断是否存在某一个样式类名
5、jquery中css方法:
getCss
setCss
setGroupCss