基于jquery中children()和find()区别的介绍

那个。children(selector)方法返回匹配元素集合中每个元素的所有子元素(仅子元素)。可选参数，添加参数意味着通过选择器和过滤元素进行过滤。那个。find(selector)方法返回匹配元素集合中每个元素的后代。参数是必需的，可以是选择器和jquery对象来过滤元素。那个。find()方法类似于。children()方法，只是后者只遍历DOM树中的一个级别。这里的孩子，我理解为儿子，只穿越到儿子的层面。请看下面的例子：复制代码如下：children (selector)方法返回匹配元素集中每个元素的所有子元素(仅子元素)。可选参数，添加参数意味着通过选择器和过滤元素进行过滤。那个。find(selector)方法返回匹配元素集合中每个元素的后代。参数是必需的，可以是选择器和jquery对象来过滤元素。那个。find()方法类似于。children()方法，只是后者只遍历DOM树中的一个级别。这里的孩子，我理解为儿子，只穿越到儿子的层面。请看下面的例子：复制代码如下： $ ('ul。二级’)。儿童()。CSS('背景色'，'红色')；这一行代码的结果是a、b和c项变成红色背景。因为我们没有应用选择器表达式，所以返回的jQuery对象包含所有子元素。如果应用了选择器，将只包括匹配的项目。看一个例子：复制代码如下：script $(文档)。ready (function () {$ ('# ABC ')。孩子们。选中')。CSS('颜色'，'蓝色')；});/script Div id=' ABC ' span hello/span p class=' selected '再次hello/p Div-将其替换为p div class=' selected '并再次/div span class=' selected' aa并再次/span/Div -更改为/p pAnd One Last Time/p /div，结果如下：。

这是预期的结果，但是如果上面的div改为p，参见上面的代码注释，结果是：。

中需要注意的知识点。find()方法：1。find是遍历当前元素集中每个元素的后代。只要符合要求，儿孙都可以做。2.与其他树遍历方法不同，选择器表达式是。查找()。如果我们需要检索所有后代元素，我们可以传递通用选择器' * '。3.find只遍历后代，不包括自身。4.选择器上下文由。find()方法。因此，$('li.item-ii ')。find('li ')相当于$('li '，' li.item-ii ')。选择器的语法是：jQuery(selector，[context])，一般用jQuery的选择器作为第一个参数。实际上，jquery()函数的这种用法还可以传递第二个参数。传递此参数的目的是将先前的选择器限制在上下文环境中。默认情况下，即不传递第二个参数，选择器从文档的根目录开始搜索DOM($()会在当前HTML文档中找到DOM元素)；如果指定了第二个参数，例如DOM元素集或jquery对象，将在这个上下文中搜索它。举个例子复制代码如下： $ ('div。foo’)。click (function () {$ ('span '，this)。add class(' bar ')；});因为我们已经将跨度选择器限制在这个环境中，所以只有被点击的元素中的跨度会得到一个额外的类。在内部，选择器上下文由。find()方法，所以$('span '，this)相当于$(this)。find('span ')，$('li.item-ii ')。find('li ')相当于$('li ')。Li.item-ii')find()有关更多信息，请访问：http://_ find . aspchilds()