遍历

jQuery的快捷遍历方法可以快速定位到想要的元素。查找祖先元素

html<div class="grandparent">
<div class="parent">
<div class="child">
<span class="subchild"></span>
</div>
</div>
<div class="surrogateParent1"></div>
<div class="surrogateParent2"></div>
</div>
$('span.subchild').parent();		//returns [div.child]
$('span.subchild').parents(); //returns [div.child, div.parents, div.grandparent]
//也可以特指获取哪个祖先元素
$('span.subchild').parents('div.parent'); //returns [div.parent]

查找祖先元素还有.parentsUntil(), .closeset()

如果想要查找后代元素呢?有.children().find()方法:

$('span.grandparent').children();	//returns [div.parent, div.surrogateParent1, div.surrogateParent2]
$('span.grandparent').find('div'); //return [div.parent, div.child, div.surrogateParent1, div.surrogateParent2]

.children().find不同之处在于children只返回一层子元素,find返回所有后代元素。

此外,如果想要查找同辈元素呢?有

  • .next()
  • .nextAll()
  • .nextUntil()
  • .prev()
  • .prevAll()
  • .prevUntil()

还有返回所有同辈元素的siblings()

读jQuery官方文档:遍历的更多相关文章

  1. 读jQuery官方文档:数据方法与辅助方法

    数据方法 有时候你可能想要在元素上面储存数据.由于浏览器兼容性问题,用原生JavaScript处理元素上的数据可能会造成内存溢出,jQuery可以帮你自动处理这些问题: //储存和取出元素数据 $(' ...

  2. 读jQuery官方文档:$(document).ready()与避免冲突

    $(document).ready() 通常你想在DOM结构加载完毕之后才执行相关脚本.使用原生JavaScript,你可能调用window.onload = function() { ... }, ...

  3. 读jQuery官方文档:样式

    样式 使用jQuery,无论是设置或者获取元素样式都十分简便. // 支持驼峰式和分割线式,两种方式等价(原生JavaScript只支持驼峰式) $('h1').css('fontSize'); $( ...

  4. 读jQuery官方文档:jQuery对象

    jQuery对象 当用$符号包裹一个CSS风格选择器的时候,你得到一个jQuery对象. var heading = $('h1'); jQuery对象是对DOM ELement封装过后的数组.注意, ...

  5. 读BeautifulSoup官方文档之与bs有关的对象和属性(1)

    自从10号又是5天没更, 是, 我再一次断更... 原因是朋友在搞python, 老问我问题, 我python也是很久没碰了, 于是为了解决他的问题, 我只能重新开始研究python, 为了快速找回感 ...

  6. 读vue-cli3 官方文档的一些学习记录

    原来一直以为vue@cli3 就是创建模板的工具,读了官方文档才知道原来这么有用,不少配置让我长见识了 Prefetch 懒加载配置 懒加载相信大家都是知道的,使用Import() 语法就可以在需要的 ...

  7. 读BeautifulSoup官方文档之html树的打印

    prettify()能返回一个格式良好的html的Unicode字符串 : markup = '<a href="http://example.com/">I link ...

  8. 读BeautifulSoup官方文档之html树的搜索(1)

    之前介绍了有关的四个对象以及他们的属性, 但是一般情况下要在杂乱的html中提取我们所需的tag(tag中包含的信息)是比较复杂的, 现在我们可以来看看到底有些什么搜索的方法. 最主要的两个方法当然是 ...

  9. 读BeautifulSoup官方文档之html树的修改

    修改html树无非是对其中标签的改动, 改动标签的名字(也就是类型), 属性和标签里的内容... 先讲这边提供了很方便的方法来对其进行改动... soup = BeautifulSoup('<b ...

随机推荐

  1. 4.2 CUDA Reduction 一步一步优化

    Reduction并行分析: 每个线程是基于一个树状的访问模型,从上至下,上一层读取数据相加得到下一层的数据.不停的迭代,直到访问完所有的数据. 利用这么多的线程块(thread block)我们需要 ...

  2. Ubuntu安装JDK1.6

    1.下载JDK 网址: http://www.oracle.com/technetwork/java/javase/downloads/java-archive-downloads-javase6-4 ...

  3. poj2152 Fire

    好难啊,我弱爆了. 题解看陈启峰的论文... /** * Problem:POJ2152 * Author:Shun Yao * Time:2013.9.2 * Result:Accepted * M ...

  4. AIM Tech Round 3 (Div. 2) (B C D E) (codeforces 709B 709C 709D 709E)

    rating又掉下去了.好不容易蓝了.... A..没读懂题,wa了好几次,明天问队友补上... B. Checkpoints 题意:一条直线上n个点x1,x2...xn,现在在位置a,求要经过任意n ...

  5. python的资料

    python2.7的类库:https://docs.python.org/2.7/library/index.html

  6. 也谈SSO,一个简单实用的单点登录Demo

    关于SSO(单点登录),百度百科解释如下 : “SSO英文全称Single Sign On,单点登录.SSO是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统.它包括可以将这次主要 ...

  7. RocketMQ入门(3)拉取消息

    转自:http://www.changeself.net/archives/rocketmq入门(3)拉取消息.html RocketMQ入门(3)拉取消息 RocketMQ不止可以直接推送消息,在消 ...

  8. 使用 StoryBoard 的时候加入用户引导页面

    如果想让一个APP加上引导页面是一个非常完美的举动 但是,总会遇到一些问题 (不要忘记在APDelegate里面加上用户引导页面的头文件和程序启动时的第一个页面哦) 情况一:纯代码 判断是否是第一次启 ...

  9. JS 函数调用

    Js函数调用的方式有如下几种情况: (1)具名函数直接调用 function foo() { } foo(); (2)匿名函数通过引用来调用 fooRef = function() { } fooRe ...

  10. Cocos2d-x——CocosBuilder官方帮助文档翻译1 使用自定义类

    原创:请注明转载! 在Cocos2d-x中使用CocosBuilder 使用自定义类 CocosBuilder的使用方法是通过自定义类.在CocosBuilder中选中一个对象并在属性栏中输入自定义类 ...