DOM树

什么是DOM 树呢？大家都知道html中的文档对象模型，他们在浏览器中存放是一种树形结构存在，就好像族谱，层次结构解析然后显示在窗口里。div 下边还有div 这就是层。现在来说说jQuery获取DOM树 中DOM对象的方法
1）祖先 parent() parents() parentsUntil() parent() 方法返回被选元素的直接父元素。该方法只会向上一级对 DOM 树进行遍历。parents() 方法返回被选元素的所有祖先元素，它一路向上直到文档的根元素 ()。parentsUntil() 方法返回介于两个给定元素之间的所有祖先元素。

//下面的例子返回每个 <span> 元素的的直接父元素：
$(document).ready(function(){
  $("span").parent();
});
//下面的例子返回所有 <span> 元素的所有祖先：
$(document).ready(function(){
  $("span").parents();
});
//下面的例子返回所有 <span> 元素的所有祖先，并且它是 <ul> 元素：
$(document).ready(function(){
  $("span").parents("ul");
});
//下面的例子返回介于 <span> 与 <div> 元素之间的所有祖先元素：
$(document).ready(function(){
  $("span").parentsUntil("div");
});

2)下面是两个用于向下遍历 DOM 树的 jQuery 方法：children() find();
children() 方法返回被选元素的所有直接子元素。该方法只会向下一级对 DOM 树进行遍历。find() 方法返回被选元素的后代元素，一路向下直到最后一个后代。

//下面的例子返回每个 <div> 元素的所有直接子元素：
$(document).ready(function(){
  $("div").children();
});
//您也可以使用可选参数来过滤对子元素的搜索。
//下面的例子返回类名为 "1" 的所有 <p> 元素，并且它们是 <div> 的直接子元素：
$(document).ready(function(){
  $("div").children("p.1");
});
//下面的例子返回属于 <div> 后代的所有 <span> 元素：
$(document).ready(function(){
  $("div").find("span");
});
//下面的例子返回 <div> 的所有后代：
$(document).ready(function(){
  $("div").find("*");
});

3)同胞 siblings()next() nextAll() nextUntil() prev() prevAll() prevUntil()。
siblings() 方法返回被选元素的所有同胞元素。 其他的函数用法都差不多，就不多介绍了。

//下面的例子返回 <h2> 的所有同胞元素：
$(document).ready(function(){
  $("h2").siblings();
});
//下面的例子返回属于 <h2> 的同胞元素的所有 <p> 元素：
$(document).ready(function(){
  $("h2").siblings("p");
});