@H_301_0@　Dom是Document Object Model的缩写，意思是文档对象模型。DOM是一种与浏览器、平台、语言无关的接口，使用该接口可以轻松访问页面中所有的标准组件。

@H_301_0@

DOM操作可以分为三个方面即DOM Core(核心)、HTM-DOM和css-DOM。

@H_301_0@jQuery DOM 元素方法

@H_301_0@
<table class="dataintable" style="border-bottom: rgb(170,170,170) 1px solid; text-align: left; border-left: rgb(170,170) 1px solid; padding-bottom: 0px; text-transform: none; background-color: rgb(249,249,249); text-indent: 0px; margin: 10px 0px 0px; padding-left: 0px; width: 709px; letter-spacing: normal; padding-right: 0px; border-collapse: collapse; font: 12px Verdana,Arial,宋体; white-space: normal; color: rgb(0,0); border-top: rgb(170,170) 1px solid; border-right: rgb(170,170) 1px solid; word-spacing: 0px; padding-top: 0px; -webkit-text-stroke-width: 0px">
<tbody style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<tr style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<th style="border-bottom: rgb(170,170) 1px solid; padding-bottom: 5px; background-color: rgb(213,213,213); margin: 0px; padding-left: 6px; padding-right: 15px; vertical-align: baseline; border-top: rgb(170,170) 1px solid; padding-top: 5px">函数
<th style="border-bottom: rgb(170,170) 1px solid; padding-top: 5px">描述
</tr>
<tr style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<td style="border-bottom: rgb(170,170) 1px solid; border-left: rgb(170,170) 1px solid; padding-bottom: 6px; background-color: rgb(239,239,239); margin: 0px; padding-left: 6px; padding-right: 15px; vertical-align: text-top; border-top: rgb(170,170) 1px solid; padding-top: 6px"><a title="jQuery DOM 元素方法 - get() 方法" href="http://www.w3school.com.cn/jquery/dom_element_methods_get.asp" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; background-color: transparent; margin: 0px; padding-left: 0px; padding-right: 0px; color: rgb(144,11,9); border-top: 0px; border-right: 0px; text-decoration: underline; padding-top: 0px">.get()</td>
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px">获得由选择器指定的 DOM 元素。</td>
</tr>
<tr style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px"><a title="jQuery DOM 元素方法 - index() 方法" href="http://www.w3school.com.cn/jquery/dom_element_methods_index.asp" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; background-color: transparent; margin: 0px; padding-left: 0px; padding-right: 0px; color: rgb(144,9); border-top: 0px; border-right: 0px; text-decoration: underline; padding-top: 0px">.index()</td>
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px">返回指定元素相对于其他指定元素的 index 位置。</td>
</tr>
<tr style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px"><a title="jQuery DOM 元素方法 - size() 方法" href="http://www.w3school.com.cn/jquery/dom_element_methods_size.asp" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; background-color: transparent; margin: 0px; padding-left: 0px; padding-right: 0px; color: rgb(144,9); border-top: 0px; border-right: 0px; text-decoration: underline; padding-top: 0px">.size()</td>
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px">返回被 jQuery 选择器匹配的元素的数量。</td>
</tr>
<tr style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; margin: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px">
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px"><a title="jQuery DOM 元素方法 - toArray() 方法" href="http://www.w3school.com.cn/jquery/dom_element_methods_toarray.asp" style="border-bottom: 0px; border-left: 0px; padding-bottom: 0px; background-color: transparent; margin: 0px; padding-left: 0px; padding-right: 0px; color: rgb(144,9); border-top: 0px; border-right: 0px; text-decoration: underline; padding-top: 0px">.toArray()</td>
<td style="border-bottom: rgb(170,170) 1px solid; padding-top: 6px">以数组的形式返回 jQuery 选择器匹配的元素。</td>
</tr>

@H_301_0@

1.attr() .removeAttr()

@H_301_0@.attr() 方法可以传入一个名值对的参数，也可以传入一个包含2个以上名值对的对象参数，例如：

@H_301_0@.attr('src','images/a.jpg');

@H_301_0@当然，也可以移除一个或者一个以上属性.removeAttr('id rel');

@H_301_0@

2.prop()

@H_301_0@该方法可以取得属性值

@H_301_0@传入想要取得的值的属性名（字符串），例如.prop('id')；

@H_301_0@设置id的值(修改DOM本身存在的属性比如a标签的href，id) .prop('id','otherid');

@H_301_0@

3.val()

@H_301_0@这个方法经常用于取得表单控件的值

@H_301_0@

4.insertBefore() .insertAfter() .prependTo() .appendTo()

@H_301_0@.insertBefore()在现有元素外部、之前添加内容；(反向操作 .before()) .insertAfter()在现有元素外部、之后添加内容；(反向操作 .after()) .prependTo()在现有元素内部、之前添加内容；(反向操作 .prepend()) .appendTo()在现有元素内部、之后添加内容；(反向操作 .append())

@H_301_0@

5.clone()

@H_301_0@该方法可以复制拷贝元素，如果需要复制出来的元素继承其他事件，需要传入一个布尔值作为参数，.clone(true)

@H_301_0@

6.wrap() .wrapAll() .wrapInner()

@H_301_0@.wrap()和.wrapInner()可以理解成相对的，.wrap()是包在元素外面一层，而.wrapWith()是包在元素里面一层，

@H_301_0@而.wrapAll()是在所有匹配到的元素外围包裹

@H_301_0@

7.html() .text() .replaceWith() .replaceAll()

@H_301_0@.html()可以传入文本或者DOM节点;

@H_301_0@.text()只能读取或者替换文本;

@H_301_0@.replaceWith() 把。。。替换“成”。。。;

@H_301_0@.replaceAll() 把。。。替换“给”。。。

@H_301_0@

8.empty()

@H_301_0@移除元素

@H_301_0@

9.detach() .remove()

@H_301_0@这2个方法有点相似，都不会把匹配的元素从jQuery对象中删除，但是还是有所区别：

@H_301_0@.detach() 所有绑定的事件、附加的数据等都会保留下来

@H_301_0@.remove() 除了这个元素本身得以保留之外，其他的比如 绑定的事件，附加的数据等都会被移除。