标签每出现一次，一个 TableRow 对象就会被创建。
cells 集合返回表格中所有
或 元素。
TableCell 对象
TableCell 对象代表一个 HTML 表格单元格。
在一个 HTML 文档中
标签每出现一次，一个 TableCell 对象就会被创建
Table 对象方法
方法
描述
createCaption()
为表格创建一个 caption 元素。
createTFoot()
在表格中创建一个空的 tFoot 元素。
createTHead()
在表格中创建一个空的 tHead 元素。
deleteCaption()
从表格删除 caption 元素以及其内容。
deleteRow()
从表格删除一行。
deleteTFoot()
从表格删除 tFoot 元素及其内容。
deleteTHead()
从表格删除 tHead 元素及其内容。
insertRow()
在表格中插入一个新行。
四.文档对象模型(DOM)
DOM节点树模型（以HTML DOM树为例）
DOM模型将整个文档（XML文档和HTML文档）看成一个树形结构，
在DOM中，HTML文档的层次结构被表示为一个树形结构。并用document对象表示该文档，树的每个子节点表示HTML文档中的不同内容。
每个载入浏览器的 HTML 文档都会成为 Document 对象,Document是探索DOM的入口,利用全局变量document可以访问Document对象
4.1认识DOM 先看下面代码
将HTML代码分解为DOM节点层次图:
DOM通过创建树来表示文档，描述了处理网页内容的方法和接口，从而使开发者对文档的内容和结构具有空前的控制力，用DOM API可以轻松地删除、添加和替换节点。
1）节点类型
DOM规定文档中的每个成分都是一个节点（Node）,HTML文档可以说由节点构成的集合，DOM节点有:
2） DOM节点三大属性（XML DOM）
属性
描述
nodeName
元素节点、属性节点、文本节点分别返回元素的名称、属性的名称和#text的字符串。
nodeType
元素节点、属性节点、文本节点的nodeType值分别为1、2、3.、
nodeValue
元素节点、属性节点、文本节点的返回值分别为null、属性值和文本节点内容。
4.2 DOM常见操作 Node为所有节点的父接口，其定义了一组公共的属性和方法，如下：
1）获取节点
① 获取元素节点 ：通过document对象的三个方法获取
document.getElementById("ID")
document.getElementByName("name")
document.getElementsByTagName("p");
② 获取属性节点 ：属性节点附属于元素节点，可通过元素节点的getAttributeNode(attrName) 方法获取属性节点，也可通过getAttribute(attrName) 直接获取属性值。（与之相对的是Element接口的setAttribute(attrName , attrValue)方法，如果属性不存在，则直接添加到元素节点上）
③ 获取文本节点 ：文本节点为元素节点的子节点，可通过元素节点（Element接口）提供的childnodes()[index] 方法获得。
childNodes //NodeList，所有子节点的列表
firstChild //Node，指向在childNodes列表中的第一个节点
lastChild //Node，指向在childNodes列表中的最后一个节点
parentNode //Node，指向父节点
previousSibling /Node，/指向前一个兄弟节点：如果这个节点就是第一个节点，那么该值为 null
nextSibling //Node，指向后一个兄弟节点：如果这个节点就是最后一个节点，那么该值为null
hasChildNodes()` //Boolean，当childNodes包含一个或多个节点时，返回真值
2）改变节点
① 改变属性节点的值 ：可以通过属性节点的nodeValue直接修改属性值，也可通过元素节点的setAttribute()方法改变。
② 改变文本节点的值 ：通过文本节点的nodeValue直接修改。
在HTML DOM中，获取和改变元素内容最简单方法是使用元素的innerHTML属性（innerText属性返回去掉标签的innerHTML）
拓展:
innerText、innerHTML、outerHTML、outerText
innerText: 表示起始标签和结束标签之间的文本
innerHTML: 表示元素的所有元素和文本的HTML代码
如：
Hello world
的innerText为Hello world，innerHTML为Hello world
outerText: 与前者的区别是替换的是整个目标节点，问题返回和innerText一样的内容
outerHTML: 与前者的区别是替换的是整个目标节点，返回元素完整的HTML代码，包括元素本身
一张图了解OUTHTML和innerText、innerHTML：
改变HTML样式（style属性）：element.style.color =“red”;
3）删除节点
① 删除元素节点 ：要想删除元素节点A，需获得A的父节点B，父节点可通过17.1.1中的方法获得，也可以直接通过A的parentNode属性获得（推荐）。调用B的removeChild(A) 即可删除A节点。
② 删除属性节点 ：可通过属性节点所属的元素节点的removeAttribute(attrName)或removeAttributeNode(node)删除。
③ 清空文本节点 ：最简单也是最常用的方法就是直接设置文本节点的nameNode属性为空串：textNode.nodeValue = ””。
混淆点:
这是一段文本
var p = document.getElementById('example');
p.nodeValue //null,p是元素节点，所以nodeValue为null
p.getAttributeNode('id').nodeValue //example，这里获取到p的id属性的属性节点，nodeValue就是它的属性值
p.childNodes[0].nodeValue //这是一段文本,
p是含有两个子节点的，插入的文本虽然没有标签，但它依然是一个节点。
其类型是是文本节点，其nodeValue是就是写入在其中的字符串，包含换行和缩进
p.innerHTML//这是一段文本
这里innerHTML返回了p所包含的全部的节点的所包含的各种值了，以字符串的形式。
4）创建和添加节点
① 创建节点 ：通过document对象的createElement(eleName)、createTextNode(nodeValue)方法可分别创建元素节点和文本节点。属性节点也有自己的create方法，但是用的少，直接用元素节点的setAttribute()方法即可添加属性。
② 添加节点 ：两个重要的方法：appendChild()和insertBefore()，具体见Node接口中的方法。
扩展 ：上面的两个方法都是在已知父节点时用到的，也可以直接在兄弟节点后添加新节点：x.insertBefore(newNode) 和 x.appendChild(newNode) 都可以向 x 后追加一个新的子节点。
5）替换节点
主要掌握replaceChild(newNode , oldNode) 替换元素节点。（属性节点和文本节点有更简单的方法）
4.3 DOM事件 DOM同时两种事件模型：冒泡型事件和捕获型事件
冒泡型事件：事件按照从最特定的事件目标到最不特定的事件目标的顺序触发
Click Me
触发的顺序是：div、body、html(IE 6.0和Mozilla 1.0)、document、window(Mozilla 1.0)
捕获型事件：与冒泡事件相反的过程，事件从最不精确的对象开始触发，然后到最精确
上面例子触发的顺序是：document、div
DOM事件模型最独特的性质是，文本节点也触发事件(在IE中不会)。
1）事件处理函数/监听函数
在JavaScript中：
var oDiv = document.getElementById("div1");
oDiv.onclick = function(){ //onclick只能用小写
alert("Clicked!");
}
或者
var elem =document.getElementById(“id”)
elem.οnmοuseοver=handleMouseOver //handleMouseOver 是函数名
function handleMouseOve(e){...}
在HTML中：
//onclick大小写任意
扩展:
IE事件处理程序attachEvent()和detachEvent()
在IE中，每个元素和window对象都有两个方法：attachEvent()和detachEvent()，这两个方法接受两个相同的参数，事件处理程序名称和事件处理程序函数，如：
[object].attachEvent("name_of_event_handler","function_to_attach")
[object].detachEvent("name_of_event_handler","function_to_remove")
var fnClick = function(){
alert("Clicked!");
}
oDiv.attachEvent("onclick", fnClick); //添加事件处理函数
oDiv.attachEvent("onclick", fnClickAnother); // 可以添加多个事件处理函数
oDiv.detachEvent("onclick", fnClick); //移除事件处理函数
在使用attachEvent()方法的情况下，事件处理程序会在全局作用域中运行，因此this等于window。
2）跨浏览器的事件处理程序
addHandler()和removeHandler()
addHandler()方法属于一个叫EventUntil()的对象，这两个方法均接受三个相同的参数，要操作的元素，事件名称和事件处理程序函数。
3）事件处理器
执行JavaScript 代码的程序在事件发生时会对事件做出响应。为了响应一个特定事件
而被执行的代码称为事件处理器。
在HTML标签中使用事件处理器的语法是：
HTML
JS
var btn2=document.getElementById('btn2');获得btn2按钮对象
btn2.onclick //给btn2添加onclick属性，属性又触发了一个事件处理程序
btn2.οnclick=function(){
} //添加匿名函数
btn2.οnclick=null //删除onclick属性
6）DOM 2级事件处理程序
DOM 2级事件定义了两个方法，用于指定和删除事件处理程序的操作。addEventListener()和removeEventListener()
addEventListener()和removeEventListener()
在DOM中，addEventListener()和removeEventListener()用来分配和移除事件处理函数，与IE不同的是，这些方法需要三个参数：事件名称，要分配的函数和处理函数是用于冒泡阶段(false)还是捕获阶段(true)，默认为冒泡阶段false
[object].addEventListener("name_of_event",fnhander,bcapture)
[object].removeEventListener("name_of_event",fnhander,bcapture)
var fnClick = function(){
alert("Clicked!");
}
oDiv.addEventListener("onclick", fnClick, false); //添加事件处理函数
oDiv.addEventListener("onclick", fnClickAnother, false); // 与IE一样，可以添加多个事件处理函数
oDiv.removeEventListener("onclick", fnClick, false); //移除事件处理函数
如果使用addEventListener()将事件处理函数加入到捕获阶段，则必须在removeEventListener()中指明是捕获阶段，才能正确地将这个事件处理函数删除
oDiv.onclick = fnClick;
oDiv.onclick = fnClickAnother; //使用直接赋值，后续的事件处理函数会覆盖前面的处理函数
oDiv.onclick = fnClick;
oDiv.addEventListener("onclick", fnClickAnother, false); //会按顺序进行调用，不会覆盖
7）事件类型
鼠标事件： click、dbclick、mousedown、mouseup、mouseover、mouseout、mousemove
键盘事件 ：keydown、keypress、keyup
HTML事件 ：load、unload、abort、error、select、change、submit、reset、resize、scroll、focus、blur
Window 事件属性(没加蓝的都是h 5新事件)
针对 window 对象触发的事件（应用到
标签）：
属性
onafterprint 文档打印之后运行的脚本。
onbeforeprint 文档打印之前运行的脚本。
onbeforeunload 文档卸载之前运行的脚本。
onerror 在错误发生时运行的脚本。
onhaschange 当文档已改变时运行的脚本。
onload 页面结束加载之后触发。
onmessage 在消息被触发时运行的脚本。
可以使用调用 postMessage ()向主线程发送消息,在某些场景下，业务调用方可能需要主动跟定位组件通信,可以通过html5 postMessage的方式主动与定位组件发起通信
onoffline 当文档离线时运行的脚本。
ononline 当文档上线时运行的脚本。
onpagehide 当窗口隐藏时运行的脚本。
onpageshow 当窗口成为可见时运行的脚本。
onpopstate 当窗口历史记录改变时运行的脚本。
onredo 当文档执行撤销（redo）时运行的脚本。
onresize 当浏览器窗口被调整大小时触发。
onstorage 在 Web Storage 区域更新后运行的脚本。
onundo 在文档执行 undo 时运行的脚本。
onunload 一旦页面已下载时触发（或者浏览器窗口已被关闭）。
Form 事件
由 HTML 表单内的动作触发的事件（应用到几乎所有 HTML 元素，但最常用在 form 元素中）：
属性
onblur 元素失去焦点时运行的脚本。
onchange在元素值被改变时运行的脚本。
oncontextmenu 当上下文菜单被触发时运行的脚本。
onfocus 当元素失去焦点时运行的脚本。
onformchange 在表单改变时运行的脚本。
onforminput 当表单获得用户输入时运行的脚本。
oninput 当元素获得用户输入时运行的脚本。
oninvalid 当元素无效时运行的脚本。
onreset 当表单中的重置按钮被点击时触发。HTML5 中不支持。
onselect 在元素中文本被选中后触发。
onsubmit 在提交表单时触发。
Event对象
Event对象的常用属性
名称
说明
返回
type
事件的名称如mouseover
字符串
target
事件指向的元素
HTMLElement
获得event对象兼容性写法
document.οnclick=function(event){
event = event || window.event;
};
个别事件讲解
oninput,onpropertychange,onchange的用法
oninput:
oninput 事件在用户输入时触发。
该事件在
