遍历DOM树,each()遍历
在《jQuery教程/理解选取更新范围》一节中,我们知道:当选择器返回了多个元素时,可以使用一个方法来更新所有的元素,不再需要使用循环。
然后有的时候需要遍历元素,怎么办?
使用each()方法可以遍历。
示例:
|
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
|
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>each()遍历</title> </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').each(function(){ // 获取每个li元素的id var ids=this.id; // li元素的id追加到li元素后面 $(this).append('<em >'+ids+'</em>'); }); </script> </body></html> |
在使用时,each()方法的参数通常是一个匿名函数。用于及时处理遍历的元素。
注意:
this关键字用于访问当前元素,它的意义是代表当前元素。
$(this)的意思是使用关键字this创建一个包含当前元素的jQuery对象。
遍历DOM树,each()遍历的更多相关文章
- 函数遍历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树 ...
- JavaScript 算法应用: 遍历DOM树的两种方式
1 常见的DOM树结构: 2 DOM数遍历有两种方式: 3 广度优先代码: 4 深度优先遍历代码
- 遍历DOM树,理解更新范围
在JavaScript中,如果需求对多个元素重复进行同样的操作,就需要写一个循环来遍历选中的所有元素. 在jQuery中,当选择器返回了多个元素时,可以使用一个方法来更新所有的元素,不再需要使用循环. ...
- 遍历DOM树,链式操作
如果需要在同一个选取结果上使用多个jQuery方法,可以同时列出这些方法,并用.隔开,如下面的代码. 1 $("#one").hide().delay(500).fadeIn(15 ...
随机推荐
- Abp.AutoMapper扩展(1) --static class AutoMapExtensions
// 摘要: // Converts an object to another using AutoMapper library. Creates a new object ...
- 报错:Column count doesn't match value count at row 1
mysql错误:Column count doesn't match value count at row 1 意思是存储的数据与数据库表的字段类型定义不相匹配. 解决办法:检查段类型是否正确, 是否 ...
- C#多线程学习笔记之(abort与join配合使用)
今天刚开始学多线程,尽管以前用过一点点,但是只是照着网上代码抄,没有真正理解,现在回过头来想研究研究,慢慢弄懂,下面就是我在网上所找资料的例子,相信大家都看过,做了小点改动 View Code nam ...
- Qt Opengl
目前在Qt5中做Opengl的学习时候,发现gluPerspective函数没有定义. 1: gluPerspective( 45.0, (GLfloat)width/(GLfloat)height, ...
- Android手动控制软键盘的开启和关闭,判断软键盘是否显示;
工具类,拿走就能用: import android.annotation.TargetApi; import android.app.Activity; import android.content. ...
- Django之用户认证auth模块
一 Django中的auth模块: 我们在使用模块之前要先导入模块: from django.contrib import auth django.contrib.auth中提供了许多方法,这里主要介 ...
- Linux 安装redis 基本配置 发布订阅,安全配置,持久化 rdb ,aof
redis redis相关配置1.yum 源码 rpm yum 快速,间接,高效,解决依赖关系,(自动安装到某个路径,不可控),通过yum安装的软件查询命令 rpm -ql nginx yum源 ...
- js语法规则 ---console.log ---- prompt ----基本类型 ---parseInt
在页面中可以在body里面加入type=”text/javascript” 例如: <script type="text/javascript"> </scrip ...
- tornado-模版reverse_url
from tornado.web import url handler=[ url(r"/hello", grab_handler.HelloHandler, name='hell ...
- gentoo samba 密码错误
参考 Samba Share Password Refused https://social.technet.microsoft.com/Forums/windows/en-US/8249ad4c-6 ...