初学JQuery的DOM操作

1.DOM操作分类：

       DOM的分为3个方面，即DOM Core（核心）、HTML-DOM和CSS-DOM。

     DOM Core是JavaScript中类似于getElementById()、getElementsByTagName()、getAttribute()和setAttribute()等；HTML-DOM主要是面试HTML元素的属性，如document.src, document.forms等；CSS-DOM主要是针对CSS的操作，像JavaScript中的element.style.color="red"。

2. jQuery中的DOM的操作

     查找节点的方法有：$("element") ，属性方法$("element").attr("attr")。

    创建节点的方法有：$("<div/>")或者$("<div>hello world</div>"),而不能是$("<div>");

    插入节点的方法：

          append()是向每个匹配的元素内部追加内容，如$(A).append(B);是把B插入到A元素的最后一个子元素的后面；

          appendTo()是将所有匹配的元素追加到指定元素中，以append的参数相反。如$(A).append(B)是把A元素插入到B元素的最后一个子元素的后面。

         prepend()向每个匹配的元素内部前置内容，用法如同append，是把B元素插入到A元素的第一个子元素的前面。

         prependTo()向所有匹配元素前置到指定的元素中。与appendTo的用法一样。只是插入的位置是B元素的第一个子元素的前面。

         after()在每个匹配的元素后面追加内容。

         insertAfter()和after功能一样，与appendTo用法一样。

         before()在每个匹配的元素前面追加内容。与after相反。

        insertBefore()功能和before一样，用法和appendTo一样。

3.删除节点

      删除节点的方法有：remove()、detach()、empty()。remove和detach都是移除元素。而不同的是detach不会移除绑定的事件。empty()是清空节点的所有后代元素。

4.复制节点

      复制节点的方法是clone(),它可接受一个参数true or false。入过传入的参数是true的话连体绑定的事件也一起复制。

5.替换节点 

      replaceWith()和replaceAll(),用户与append()与appendTo()一样。主要功能是替换节点。

6. 包裹节点

       包裹节点的方法有wrap(),wrapAll(),wrapInner().

       wrap()是在每个匹配的元素之外都用相应的节点来包裹。wrapAll()是把所有匹配的元素移动到第一个匹配元素之后全部一起包裹。wrapInner()是对每个匹配元素的text进行包裹。

7. 属性操作

       JQuery的属性操作是attr()。可设置和获取。删除属性可用removeAttr().

8.样式操作

    attr("class")、addClass()、removeClass()、hasClass()分别可获取样式、追加样式、移除样式和判断样式。还有一个toggleClass()是样式的切换。

9.遍历节点

    children()(多个)、next()(一个)、prev()(一个)、siblings()(多个)、parent()(一个)、parents()(多个)、closest()(一个).

10.其他的一些方法

    html()、text()、val() .offset() 、position()、scrollTop()和scrollLeft()方法等。