jQuery中的DOM操作

内部插入节点：

append():向每个匹配的元素的内部的结尾处追加内容

$("#bj").append($("#nj"));//nj加到bj后面

appendTo():将每个匹配的元素追加到指定的元素的内部结尾处

$("#bj").appendTo($("#nj"));//bj加到nj的后面

prepend():向每个匹配的元素内部的开始处插入内容

$("#bj").prepend($("#nj"));//nj加在bj前面

prependTo();将每个匹配的元素插入到指定的元素内部的开始处

$("#bj").prependTo($("#nj"));//bj加在nj前面

外部插入节点：

after():在每个匹配的元素之后插入内容，after后面的元素插到after前面的元素的后面

before()：在每个匹配的元素之前插入内容，before后面的元素插到before前面的元素的前面

insertAfter():把所有匹配的元素插入到另一个指定的元素或元素集合的后面，前面的元素插到后面的元素的后面

insertBefore():把所有匹配的元素插入到另一个指定的元素或元素集合的前面，前面的元素插到后面的元素的前面

创建节点：

使用jQuery的工厂函数$(html)，会根据传入的html标记字符串创建一个DOM对象，并把这个对象封装成一个jQuery对象返回,例如：$("<p></p>");这样就创建了一个p元素节点

注意：(1)动态创建的节点不会自动添加到文档中去

   (2)应使用闭合标签和标准的XHTML格式

删除节点：

remove()：从DOM中删除所用匹配的元素,该节点所包含的所有后代节点将被同时删除.这个方法的返回值是一个指向已被删除的节点的引用.

empty():清空节点，清空元素中的所有后代节点(不包含属性节点).

复制节点：

clone():克隆匹配的DOM元素，返回一个克隆后的元素

clone(true):复制元素的同时也复制元素中的事件

替换节点：

replaceWith():将所有匹配的元素都替换为指定的HTML和DOM元素

$("button").replaceWith($("<p>123</P>"));//用后面替换前面

replaceAll():颠倒了的replaceWith()

$("button").replaceAll($("<p>123</P>"));//用前面替换后面

属性操作：

attr():获取和设置属性，该方法包含了get和set两种形式，当传入一个参数时表示获取属性，当传入两个参数时，表示设置属性。

jQuery中有很多方法都是一个函数实现获取和设置.如:attr(), html(), text(), val(),height(), width(), css() 等.

removeAttr("属性名"):删除指定元素的指定属性

样式操作：

1.获取和设置class：atrr()

2.追加样式：addClass()

3.移除样式：removeClass()

4.切换样式：toggleClass()

5.判断是否含有某个样式：hasClass()

6.获取和设置元素的样式属性：css()

7.获取和设置元素的透明度：opacity()

8.获取元素高度和宽度：height()，width()

9.获取元素在当前视窗中的相对位移，offset()，该方法只对可见元素有效，其返回对象包含了两个属性：top和left

获取和设置HTML、文本和值

1.读取和设置某个元素中的HTML内容：html("<p></p>");

2.读取和设置某个元素中的文本内容：text()

3.读取和设置某个元素中的值：val()

遍历节点：

1.获取匹配元素的所有子元素组成的集合：children();

2.获取匹配元素后面紧邻的同辈元素的集合:next();

3.获取匹配元素前面紧邻的同辈元素的集合:prev()

4.获取匹配元素前后所有的同辈元素: siblings()

其他操作：

1.获取焦点：focus()

2.数去焦点：blur()

3.加载DOM：$(document).ready()

window.onload()与$(document).ready()的区别：

window.onload()：(1)必须等待页面中的所有内容加载完后才能执行（包括加载图片等）

(2)不能同时编写多个

$(document).ready()：(1)网页中的所有DOM结构绘制完毕后就执行，可能有些与DOM元素关联的东西并没有被加载

(2)可以编写多个