3分钟了解jQuery同胞遍历
沉沙 2018-07-24 来源 : 阅读 1179 评论 0

摘要:同胞的概念有点广泛了,在一定程度上长辈和晚辈都属于同胞的范畴。不过这里的同胞指的jQuery的同胞,是指拥有相同父级元素的元素,可以理解为DOM树中同级的意思。希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。

同胞的概念有点广泛了,在一定程度上长辈和晚辈都属于同胞的范畴。不过这里的同胞指的jQuery的同胞,是指拥有相同父级元素的元素,可以理解为DOM树中同级的意思。

其实能让我们在DOM树进行水平遍历的方法十分的丰富。总共是以下几种。

· siblings()

· next()

· nextAll()

· nextUntil()

· prev()

· prevAll()

· prevUntil()

先来说下siblings()方法,该方法返回被选元素的所有同胞元素。

jQuery siblings() 方法

/*jQuery  Code*/

$("h2").siblings().css({"color":"red","border":"2px solid red"});

 

/*HTML  code*/<div>div (父)

  <p>p</p>

  <span>span</span>

  <h2>h2</h2>

  <h3>h3</h3>

  <p>p</p></div>

结果:

 

siblings方法返回结果

next()方法返回被选元素的下一个同胞元素。

jQuery next()方法

/*jQuery  code*/

$("h2").next().css({"color":"red","border":"2px solid red"});

 

/*HTML  code*/<div>div (父)

  <p>p</p>

  <span>span</span>

  <h2>h2</h2>

  <h3>h3</h3>

  <p>p</p></div>

 

next()方法返回结果

nextAll()方法返回被选元素的所有跟随的同胞元素。这点和next(),有点差异。nextall()是返回所有,next()是返回一个。nextUntil()方法是返回介于两个给定参数之间的所有跟随的同胞元素。

prev(),prevAll(),prevUntil()三个方法和next的方向相反,next是向后查找遍历,prev是向前查找遍历。知道了一种也就等于辺了全部。

 

本文由职坐标整理并发布,了解更多内容,请关注职坐标WEB前端jQuery频道!

本文由 @沉沙 发布于职坐标。未经许可,禁止转载。
喜欢 | 0 不喜欢 | 0
看完这篇文章有何感觉?已经有0人表态,0%的人喜欢 快给朋友分享吧~
评论(0)
后参与评论

您输入的评论内容中包含违禁敏感词

我知道了

助您圆梦职场 匹配合适岗位
验证码手机号,获得海同独家IT培训资料
选择就业方向:
人工智能物联网
大数据开发/分析
人工智能Python
Java全栈开发
WEB前端+H5

请输入正确的手机号码

请输入正确的验证码

获取验证码

您今天的短信下发次数太多了,明天再试试吧!

提交

我们会在第一时间安排职业规划师联系您!

您也可以联系我们的职业规划师咨询:

小职老师的微信号:z_zhizuobiao
小职老师的微信号:z_zhizuobiao

版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
 沪公网安备 31011502005948号    

©2015 www.zhizuobiao.com All Rights Reserved

208小时内训课程