遍历DOM树,过滤节点
jQuery还提供以下方法来过滤节点。
方法 | 说明 |
first() | 获取第一个,示例 $('li').last() |
last() | 获取最后一个,示例$('li').last() |
eq() | 获取指定索引的节点,索引从0开始,示例$('li').eq(1),获取第二个li |
not() | 不包含某些,示例$('li').not("#d") |
filter() | 包含某些, 示例$("li").filter("#d"),未包含的未选取 |
示例:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
|
<!DOCTYPE html> < html > < head > < meta charset = "UTF-8" > < title >过滤节点</ title > < style > .box{ border: 1px solid blueviolet; padding: 1px; margin-bottom: 12px; } </ style > </ head > < body > < div > < ul id = "ul" > < li id = "a" >油条</ li > < li id = "b" >包子</ li > < li id = "c" >米饺</ li > < li id = "d" >< a >鱼粉</ a ></ li > </ ul > </ div > < script > $('li').filter("#d").attr("class", "box"); </ script > </ body > </ html > |
1使用first()方法过滤元素。
示例 $('li').first()
2使用last()方法过滤元素
示例 $('li').last()
3使用eq()方法过滤元素。
示例$('li').eq(1),获取第二个li
4使用not()方法过滤元素。
$("li").filter("#d")
遍历DOM树,过滤节点的更多相关文章
- SAX解析xml (遍历DOM树各节点)
本文参考 http://yangjunfeng.iteye.com/blog/401377 1. books.xml <?xml version="1.0" encoding ...
- 函数遍历DOM树
//获取页面中的根节点--根标签 var root=document.documentElement;//html //函数遍历DOM树 //根据根节点,调用fn的函数,显示的是根节点的名 ...
- 先序遍历DOM树的5种方法
DOM树由文档中的所有节点(元素节点.文本节点.注释节点等)所构成的一个树结构,DOM树的解析和构建是浏览器要实现的关键功能.既然DOM树是一个树结构,那么我们就可以使用遍历树结构的相关方法来对DOM ...
- jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别
http://www.poluoluo.com/jzxy/201312/253059.html 在这个sprint中,因为要写前端UI,所以用到了jQuery,但是jQuery在向上遍历DOM树的AP ...
- 拷贝和遍历DOM树
一.浅拷贝: 拷贝就是复制,就相当于把一个对象中的所有内容,复制一份给另一个对象,直接复制, 或者说,就是把一个对象的地址给了另外一个对象,他们的指向相同,两个对象之间有相同的属性或者方法,都可以使用 ...
- JS高级---遍历DOM树
遍历DOM树 第一个函数: 给我根节点, 我会找到所有的子节点: forDOM(根节点) 获取这个根节点的子节点 var children=根节点的.children 调用第二个函数 第二个 ...
- 遍历DOM树
遍历DOM在jQuery中是非常重要的技术. 遍历DOM之前,需要对DOM有清晰的认识,了解文档节点.元素节点.属性节点.文本节点等相关概念.不清楚可以温习下<JavaScript教程.DOM树 ...
- 遍历DOM树,获取子节点
获取子节点的方法有: 方法 说明 children() 选取子节点,可以带过滤参数.但只能选择子节点,不能选择孙子节点. find() 选取子节点,可以带过滤参数.可以选择子节点及孙子节点 ...
- 遍历DOM树,获取所有兄弟节点
获取兄弟节点的常用方法有: 方法 说明 siblings() 选取所有兄弟节点 next() 选取后面兄弟节点 nextAll() 选取所有后面的兄弟节点 nextUntil() 选取所有 ...
随机推荐
- golang "text/template" 模板语法简明教程
转自:https://www.cnblogs.com/Pynix/p/4154630.html [模板标签] 模板标签用"{{"和"}}"括起来 [注释] ...
- FIN omitted, FIN-ACK sent
STACKOVER ADDRESS:https://stackoverflow.com/questions/21390479/fin-omitted-fin-ack-sent question: As ...
- servlet的执行过程简介(从tomcat服务器和web应用的角度)
该链接详解htttp请求和响应 http://www.cnblogs.com/goxcheer/p/8424175.html 1.web应用工程发布到tomcat服务器 2.客户端访问某个web资源, ...
- Fragment与Radiogroup联动,经典的主界面布局。使用show和hide的方式实现;
Fragment+RadioGroup经典的主界面布局,方便实用: 1.使用replace方式: 直接上代码,先是布局文件: <?xml version="1.0" enco ...
- json与bson的区别
bson是由10gen开发的一个数据格式,目前主要用于mongoDB中,是mongoDB的数据存储格式.bson基于json格式,选择json进行改造的原因主要是json的通用性及json的schem ...
- Web Service进阶
选框架犹如选媳妇,选来选去,最后我还是选了“丑媳妇(CXF)”,为什么是它?因为 CXF 是 Apache 旗下的一款非常优秀的 WS 开源框架,具备轻量级的特性,而且能无缝整合到 Spring 中. ...
- springboot打包
springboot项目运行package命令,默认打出来的jar包只有几kb.想要打出可执行的jar包,加入插件: <build> <plugins> <plugin& ...
- OSB格式(REST)转化(XML到JSON,JSON到XML)
OSB转换项目操作手册 新建一个OSB项目 建立以下文件夹,以便更规范的管理工程 一.XML转JSON 1.导入wsdl文件 1)右键wsdl文件夹,选择import选项 2)在弹出框中选择Servi ...
- 【Selenium-WebDriver自学】Selenium-IDE验证点(五)
==================================================================================================== ...
- ROS Industrial 简介
ROS_I means ROS Industrial ROS_I 解决了哪些问题: 1. 让自动化可以互相协作,操纵器.末端执行器.感知系统/传感器,移动平台,周边设备,都可只用一种语言(ROS me ...