本文主要是介绍《锋利的jQuery》笔记—DOM部分，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
DOM操作分成三个方面：|--DOM Core(核心)：并不专属于JavaScript，任何一种支持DOM的程序设计语言都可以使用它。
|--HTML-DOM
|--CSS-DOM：是针对CSS的操作。该技术的主要作用是获取和设置style对象的各种属性，可以使网页呈现出各种不同的效果。
jQuery中的DOM操作：
1.查找节点
（1）查找元素节点
var $li=$("ul li:eq(1)");
var li_txt=$li.text();
alert(li_txt);
(2)查找属性节点：利用jQuery选择器找到需要的元素后，就可以使用attr()方法来获取它的各种属性的值。
var $para=$("p");
var p_txt=$para.attr("title");
alert(p_txt);
2.创建节点
(1)创建元素节点
var $li=$("<li></li>");
$("html").append($li);
(2)创建文件节点
var $li=$("<li>苹果</li>");
$("ul").append($li);
(3)创建属性节点
var $li=$("<li title='苹果'>苹果</li>");
$("ul").append($li);
3.插入节点
append(); //向每个匹配的元素内部追加内容 appendTO();
prepend(); //向每个匹配的元素内部前置内容 prependTo();
after(); //在每个匹配的元素之后插入内容 insertAfter();
before(); //在每个匹配的元素之前插入内容 insertBefore();
4.删除节点
remove(); //这个方法的返回值是一个指向已被删除的节点的引用，因此可以在以后再使用这些元素。
val $li=$("ul li:eq(1)").remove();
$("ul").append($li);
$("ul li").remove("li[title='香蕉']");
empty(); //不是删除节点，而是清空节点，它能清空元素中的所有后代节点。
$("ul li:eq(1)").empty();
5.复制节点
clone(); //在clone()方法中传递了一个参数true，它的含义是复制元素的同时复制元素中绑定的事件。
$("ul li").click(function(){
$(this).clone(true).appendTo("ul");
})
6.替换节点
replaceAll();
replaceWith();
7.包裹节点
wrapAll();//将所有匹配的元素用一个元素来包裹
$("strong").wrapAll("<b></b>");
wrapInner();//将每一个匹配的元素的子内容（包括文本节点）用其他结构化的标记包裹起来。
8.属性操作
(1)获取和设置属性
$("p").attr("title");//获取<p>元素节点属性title。
$("p").attr("title","helloworld");//设置title属性的值
$("p").attr({"title":"hello","name":"zhangsan","age":"28"});
(2)删除属性
$("p").removeAttr("title");
9.样式操作
(1)获取样式和设置样式
var p_class=$("p").attr("class");//获取p元素的class值
$("p").attr("class","high");//设置p元素的class值为high
(2)追加样式
$("p").addClass("another");
(3)移除样式
$("p").removeClass();//移除所有class
$("p").removeClass("high");
(4)切换样式
$("p").toggleClass("another");//another样式交替存在和消失
(5)判断是否含有某个样式
$("p").hasClass("another");
10.设置和获取HTML、文本和值
(1)html()方法：用于来读取或者设置某个元素中的html内容。可以用于html、XHTML，但是不能用于xml
var p_html=$("p").html();
alert(p_html);
(2)text()方法：用来读取或者设置某个元素中的文本内容（不包含html中元素标签，只有文本内容）。支持所有浏览器。对XHTML、xml都有效。
$("p").text();
(3)val()方法：用来设置和获取元素的值。
$("#single").val("hello");
$(":checkbox").val(["check2","check3"]);
11.遍历节点
(1)children()方法：用于取得匹配元素的子元素集合。
(2)next()方法：用于取得匹配元素后面紧邻的同辈元素。
(3)prev()方法：用于取得匹配元素前面紧邻的同辈元素。
(4)siblings()方法：用于取得匹配元素前后所有的同辈元素。
(5)closest()方法：用于取得最近的匹配元素。
这篇关于《锋利的jQuery》笔记—DOM部分的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
