JQuery_dom节点操作

 页面上的元素分为三种类型的节点，
第一种是元素节点，而九大选择器就是查找元素节点的。
第二种是属性节点，先找到元素节点，然后调用attr()。
第三种是文本节点，先找到元素节点，然后调用text()。

1. 查找节点
<1>查找元素节点
 var $username = $(“#username”);
 alert((“jquery “+$usernameElement.val());

<2>查找属性节点
 jQuery查找到需要的元素节点后，使用attr()方法来获取它的各种属性的值。
 $usernameElement.attr(“value”);

<3>查找文本节点
 jQuery查找到需要的元素节点后，使用text()方法来获取它的文本内容。
 $usernameElement.text();

2. 创建节点
<1>创建元素节点
 根据传入的 html 标记字符串创建一个 DOM 对象, 并把这使用 jQuery 的工厂函数 $(HTML) 。该工厂函数会把这个 DOM 对象包装成一个 jQuery 对象返回。
 当创建单个元素的时候，要注意标签闭合。例如：var $option = $("<option></option>");

<2>创建文本节点
 第一种：创建元素节点后，使用text()方法来设置其节点的文本内容。比如：$option.text("北京");

 第二种：创建元素节点是时，直接将其节点的文本内容插入其中。例如：var $option = $("<option>北京</option>");

<3>创建属性节点
 第一种：创建元素节点后，使用attr()方法来设置其节点的属性。例如：$option.attr("value","北京");

 第二种：创建元素节点时，直接将其节点的属性插入其中。例如：var $option = $("<option value="北京">北京</option>");

3. 插入节点
<1>内部插入节点

append(content)     :向每个匹配的元素的内部的结尾处追加content
appendTo(content)   :将每个匹配的元素追加到指定的元素（content）中的内部结尾处
prepend(content)    :向每个匹配的元素的内部的开始处插入content
prependTo(content)  :将每个匹配的元素插入到指定的元素（content）内部的开始处

<2>外部插入节点

after(content)      :在每个匹配的元素之后插入content
before(content)     :在每个匹配的元素之前插入content
insertAfter(content):把所有匹配的元素插入到另一个、指定的content元素元素集合的后面
insertBefore(content):把所有匹配的元素插入到另一个、指定的content元素元素集合的前面

4. 删除节点
<1>remove()
 从 DOM 中删除所有匹配的元素, 传入的参数用于根据 jQuery 表达式来筛选元素. 当某个节点用 remove() 方法删除后, 该节点所包含的所有后代节点将被同时删除. 这个方法的返回值是一个指向已被删除的节点的引用。
<2>empty()
 清空节点 – 清空元素中的所有后代节点(不包含属性节点)。

5. 复制节点
<1>clone()
 克隆匹配的 DOM 元素, 返回值为克隆后的副本. 但此时复制的新节点不具有任何行为
<2>clone(true)
 复制元素的同时也复制元素中的的事件 。

6. 替换节点
 replaceWith(): 将所有匹配的元素都替换为指定的 HTML 或 DOM 元素。
 replaceAll(): 颠倒了的 replaceWith() 方法.
注意: 若在替换之前, 已经在元素上绑定了事件, 替换后原先绑定的事件会与原先的元素一起消失。