筛选那些符合条件的孩子

本作品来给我们详细介绍有关在jquery中children()与find()用法分别,有要求了然的情侣可步向参谋。

children()是三个筛选器,看名称就会想到其意义正是筛选孩子,筛选这些符合条件的男女。

总体的格式如下:

.children(expr)

里头children是筛选器的称号,expr是表达式,全部选拔器中的表明式都得以用在那,比方按标签字”div”,按类名”.class”,按序号”:first”等等,假如表明式为空,那么再次来到的是具有的男女,重临的结果仍为jQuery对象。

jquery取索引使用eq函数。

eq() 采取器采用带有钦定 index 值的要素。

index 值从 0 初叶,全体第贰个要素的 index 值是 0(不是 1)。

日常与其余因素/选择器一齐行使,来采用钦定的组中特定序号的因素。

例子:

 代码如下

复制代码

$(‘#test’).children().eq(1).css({‘display’:’inline-block’});

将id为test的因素的第2个子成分样式设置为’display’:’inline-block’。

另一种写法

 代码如下

复制代码

$(“:eq(index)”)如:$(“p:eq(1)”)

例如:

 代码如下

复制代码

<body>
<div id=”main”>
<div id=”like” class=”rightbar”>
<h2>猜你欢快</h2>
<ul>
<li>海飞丝洗头膏</li>
<li>六神花露水</li>
<li>舒肤佳香皂</li>
<li>心相印纸巾</li>
<li>哇哈哈矿泉水</li>
<li>王老吉</li>
</ul>
</div>
<div id=”hot” class=”rightbar”>
<h2>抢手推荐</h2>
<ul>
<li>融氏山茶油</li>
<li>帮宝适纸尿裤</li>
<li>有机江米</li>
<li>妙洁垃圾袋</li>
<li>优乐美奶茶</li>
<li>亲亲果冻</li>
</ul>
</div>
<div id=”inner”></div>
</div>
</body>

<script type=”text/javascript” language=”javascript”>
//此处为jQuery代码
</script>

find() 搜索全数段落中的后代 span 成分,并将其颜色设置为天青:

 代码如下

复制代码

$(“p”).find(“span”).css(‘color’,’red’);

概念和用法

find() 方法赢安妥前成分集结中各类成分的后生,通过选取器、jQuery
对象或因一贯筛选。

语法
.find(selector)

find() 方法第三个醒目特点是,其收受的选择器表明式与我们向 $()
函数字传送递的表明式的体系一样。将由此测量试验那一个因素是或不是相配该表达式来对成分举行过滤。

请想想下边这几个大概的嵌套列表:

 代码如下

复制代码

<ul class=”level-1″>
  <li class=”item-i”>I</li>
  <li class=”item-ii”>II
    <ul class=”level-2″>
      <li class=”item-a”>A</li>
      <li class=”item-b”>B
        <ul class=”level-3″>
          <li class=”item-1″>1</li>
          <li class=”item-2″>2</li>
          <li class=”item-3″>3</li>
        </ul>
      </li>
      <li class=”item-c”>C</li>
    </ul>
  </li>
  <li class=”item-iii”>III</li>
</ul>

大家将从列表 II 开始来搜寻在那之中的列表项:

$(‘li.item-ii’).find(‘li’).css(‘background-color’, ‘red’);

 

通过以上的解释,能够总括如下:
1:children及find方法都用是用来获得element的子elements的,两者都不会回来
text node,就好像大多数的jQuery方法同样。
2:children方法获得的一味是因素一下级的子元素,即:immediate
children。
3:find方法获得全部下级元素,即:descendants of these elements in the
DOM tree
4:children方法的参数selector
是可选的(optionally),用来过滤子成分,但find方法的参数selector方法是必选的。
5:find方法其实能够透过动用 jQuery( selector, context
)来落到实处:法语如是说:Selector context is implemented with the .find()
method; therefore, $(‘li.item-ii’).find(‘li’) is equivalent to $(‘li’,
‘li.item-ii’).

children() 是三个筛选器,断章取义正是筛选…

相关文章