JavaScript系列之DOM

querySelectorAll()返回的NodeList对象并非实时的。
querySelector()返回第一个匹配的元素。若是没有匹配的元素就返回null。

HTML属性名不区分大小写，但JavaScript属性名则大小写敏感。

属性操做方法：setAttribute,getAttribute,hasAttribute,removeAttribut

dataset属性（element.dataset.camalCaseName）

attributes对象也是实时的（NamedNodeMap）。NamedNodeMap对象是经过node.attributes属性获取，获取到由该元素的全部属性构成的伪数组对象。

做为纯文本的元素内容，标准的方法是用node的textContent属性，innerText(IE)

插入节点appendChild,insertBefore
若是调用的appendChild,insertBefore将已存在文档中的一个节点再次插入，那个节点将自动从它当前的位置删除并在新的位置从新插入。

删除和替换节点removeChild，replaceChild

DocumentFragment是一种特殊的Node，它做为其余节点的一个临时的容器。能够使用createDocumentFragment方法建立一个DocumentFragment

getElementById
getElementsByName,返回nodeList
getElementsByTagName,返回nodeList
getElementsByClassName,返回nodeList(多个class用空格分开)

document属性：documentElement，body,head

parentNode
childNodes
firstChild
lastChild
nextSibling
previousSibling

文档坐标比视口标准更加基础，而且在用户滚动时它们不会发生变化。
查询窗口滚动条的位置 pageXOffset,pageYOffset(非IE,window)；scrollTop,scrollLeft(IE,document.documentElement)
查询窗口的视口尺寸 innerWidth，innerHeight(非IE,window); clientWidth,clientHeight(IE,document.documentElement)

getBoundingClientRect()返回元素在视口坐标中的位置。
getClientRects()返回类数组对象(内联元素用这个查)

scrollBy(),scrollTo()

scrollIntoView应用在元素上。其与设置window.location.hash为一个命名锚点的名字后浏览器产生的行为相似。

offsetWidth,offsetHeiight=padding+border+content（元素在屏幕上占据的空间）
offsetLeft,offsetRight 对于已定位元素的后代元素和一些其余元素（如表格元素），这些属性返回的坐标是相对于祖先元素的而非文档。
offsetParent属性指定这些属性所相对的父元素。若是offsetParent为null，这些属性都是文档坐标。

clientWidth,clientHeight=padding+content(不包含滚动条，对于行内元素老是返回0)
clientLeft，clientTop=border+scroll(对于行内元素老是返回0)

scrollWidth,scrollHeight=padding+content+overflow
scrollLeft,scrollRight指定元素的滚动条位置

表单elements属性返回的是elements[]数组，若是要明确地选取一个表单元素，能够索引表单对象的elements属性。
onsubmit事件处理程序只能经过单击“提交”按钮来触发。直接调用表单的submit()方法不触发onsubmit事件处理程序。
表单提交前调用onsubmit程序，它经过返回false可以取消提交动做。
onreset事件处理程序和onsubmit相似。

只有在解析文档时才能使用write()方法输出HTML到当前文档中。

查询选取的文本

window.getSelection().toString()没法返回表单元素input或textarea内部选中的文本（HTML5标准API）
document.selection.createRange().text能够返回文档中任意地方选取的文本
element.selectionStart,element.selectionEnd（从文本输入域或textarea元素中获取选取的文本）

全部浏览器都支持contenteditable和designMode属性。

document.queryCommandEnabled()来查询当前所使用的命令
document.queryCommandSupport()
document.queryCommandState()