DOM操作（三）

Apr 3, 2017

节点操作封装

### 设置样式的两种方法 className

style style是一个对象，不能获取内嵌和外链

  • 样式少的时候使用
  • style是对象
  • 值是字符串，没有设置值是“”；
  • 命名规则，驼峰命名。和css不一样
  • box.style.cssText = “字符串形式的样式”。

### DOM元素操作 #### 创建 元素 第一种创建方式：document.write(); 不常用，因为容易覆盖原来的页面。

第二种：直接利用元素的innerHTML方法。（innerText方法不识别标签） 用的比较多。绑定属性和内容比较方便。(节点套节点)

第三种：利用dom的api创建元素var newEle = document.createElement(“被创建元素标签”); 常用方法，指定数量的时候一般用它。 ##### 添加元素

  1. 在父元素的最后面添加元素。父元素.appendChild(新元素);
  2. 指定位置添加元素。 父元素.insertBefore(新元素,参考元素);

##### 删除，替换 父元素.removeChild(子元素); 父元素.replaceChild(新元素,被替换元素); ##### 克隆 目标元素.cloneNode(true) #### 创建 表格 ##### 方式1 createElement() ##### 方式2 rows (只读，table和textarea能用,返回值类型Array) insertRow(索引值) (只有table能调用，在指定索引值之前插入) deleteRow() (只有table能调用) cells (只读，table和textarea能用) insertCell() (只有tr能调用) deleteCell() (只有tr能调用)

### 事件