JQuery如何获取子元素的子元素，比如<ul id='menu'><li><ul><li><li&g

第一种方法:

使用$("#menu")children()html();

这样会获得"<li><ul><li></li></ul><li>"

第二种方法:

$("#menu > ul > li")

1、新建一个html文件，命名为testhtml，用于讲解JS如何获取指定DIV下的子元素LI的值。

2、在testhtml文件内，在div标签内，使用ul、li标签创建两个项目列表，li元素的值分别为项目一、项目二。

3、在testhtml文件内，设置div标签的id为mydiv，主要用于下面通过该id获得mydiv对象。

4、在testhtml文件内，使用button标签创建一个按钮，按钮名称为“获取LI的值”。

5、在testhtml文件中，给button按钮绑定onclick点击事件，当按钮被点击时，执行getli

6、通过获得li对象，使用each()方法遍历每一个li对象，通过text()方法获得li的值，使用push()方法将获得li值存进数组中。最后，使用alert()方法将所有li值输出。

7、在浏览器打开testhtml文件，点击按钮，查看结果。

Jquery获取子元素的方法有2种，分别是children()方法和find()方法。下面我们分别来使用这两种方法，看看它们有何差异。

children()方法：获取该元素下的直接子集元素

find()方法：获取该元素下的所有子集元素

分别以以下HTML代码为例：<ul><li>list1<ul><li>list1-1</li><li>list1-2</li></ul></li><li>list2<ul><li>list2-1</li><li>list2-2</li></ul></li><li>list3<ul><li>list3-1</li><li>list3-2</li></ul></li></ul>

children()方法获取ul下面直接子集元素li：$("ul")children("li")

需要注意的是，如果li元素下还有li元素，children方法将不会被获取。我们可以用length来测试获取的个数“$("ul")children("li")length”，最后输出结果为3

find()方法获取ul下所有元素li：$("ul")find("li")

需要注意的是，find方法会无限循环查找ul标签节点下的li，一直找到没有为止，用length来测试获取个数“$("ul")find("li")length”，最后输出结果为9

children和find的区别：children只会查找直接子集，而find会跨越层级查找，一直找到没有为止。

Jquery的遍历，其实就当前位置的元素相对于其他元素的位置的关系进行查找或选取HTML元素。以某项选择开始，并沿着这条线进行移动，或向上（父级）、或向下（子级）、或水平（同级），直到找到目标元素为止，这种移动也被成为对DOM进行遍历。

其实对于DOM来说，这个不陌生，Jquery的遍历也就是在DOM树上上蹿下跳，当然这种上蹿下跳不是没有规则的，胡乱的找是让人鄙视的。通俗的说，在一颗树上（你也在树上，已经爬上去了，哈哈），以你所在的位置为起点，以树上有个桃子为目的地，你的这个起点也就是当前 this ,去移动去摘桃子的过程就是Jquery遍历，所以相对应的Jquery所衍生出的遍历方法可以分为三大类，即Jquery遍历之父级（祖先）、同级（同胞）和子级（后代）三种。

以上就是关于JQuery如何获取子元素的子元素，比如<ul id='menu'><li><ul><li></li></ul><li></ul>如何获取最里面的li全部的内容，包括:JQuery如何获取子元素的子元素，比如<ul id='menu'><li><ul><li></li></ul><li></ul>如何获取最里面的li、JS如何获取指定DIV下的子元素LI值、jquery如何获取没有子节点的元素等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！