前端学习笔记(zepto或jquery)——对li标签的相关操作(三)
对li标签的相关操作——八种方式遍历li标签并获取其值
$("ul>li").forEach(function(item,index){
alert(index+":"+ item.innerHTML);
});
$("ul>li").each(function(index,item){
alert(index+":"+ item.innerHTML);
});
$("ul>li").each(function(index){
alert(index+":"+$(this).html());
});
$('ul>li').filter(function(index){
alert(index+":"+$(this).html());
})
$('ul>li').map(function(index,item){
alert(index+":"+ item.innerHTML);
});
$("ul>li").map(function(index){
alert(index+":"+$(this).html());
});
$.grep($("ul>li").get(), function(item,index){
alert(index + ":" + item.innerHTML);
});
$.grep($("ul>li").get(), function(item){
alert(item.innerHTML);
});
注:filter没有两个参数的,forEach没有一个参数的
其中一个重要的区别是,each返回的是原来的数组,并不会新创建一个数组。而map方法会返回一个新的数组。
如果在没有必要的情况下使用map,则有可能造成内存浪费。
使用each时,改变的还是原来的items数组,而使用map时,不改变items,只是新建一个新的数组。
前端学习笔记(zepto或jquery)——对li标签的相关操作(三)的更多相关文章
- 前端学习笔记(zepto或jquery)——对li标签的相关操作(二)
对li标签的相关操作——8种方式获取li标签的第一个元素的内容 1.alert($("ul>li").first().html());2.alert($('ul>li' ...
- 前端学习笔记(zepto或jquery)——对li标签的相关操作(五)
对li标签的相关操作——has与find的差异性 demo代码: <ul> <li><p>1</p></li> <li>2< ...
- 前端学习笔记(zepto或jquery)——对li标签的相关操作(四)
对li标签的相关操作——五种方式给奇数项li标签设置样式 demo演示: 1 2 3 4 5 6 7 // 详解: 通常我们为多个li添加样式时常用的是使用filter,但我们在第三节中可以看到fil ...
- 前端学习笔记(zepto或jquery)——对li标签的相关操作(一)
对li标签的相关操作——点击li标签进行样式切换的两种方式 Demo演示: 1 2 3 4 // 详解: 第一种方式(以ul为基础): $("ul").bind("cli ...
- 前端学习笔记之HTML body内常用标签
阅读目录 一 HTML语义化 二 字符实体 三 h系列标签 四 p标签 五 img标签 六 a标签 七 列表标签 八 table标签 九 form标签 一 HTML语义化 body中的标签是会显示到浏 ...
- .net学习笔记----利用System.Drawing.Image类进行图片相关操作
C#中对图片的操作主要是通过System.Drawing.Image等类进行. 一.将图片转换为字节流 /// <summary> /// 图片处理帮助类 /// </summary ...
- 【前端】Web前端学习笔记【1】
... [2015.12.02-2016.02.22]期间的学习笔记. 相关博客: Web前端学习笔记[2] 1. JS中的: (1)continue 语句 (带有或不带标签引用)只能用在循环中. ( ...
- Web前端学习笔记(001)
....编号 ........类别 ............条目 ................明细....................时间 一.Web前端学习笔记 ...
- 【前端】Web前端学习笔记【2】
[2016.02.22至今]的学习笔记. 相关博客: Web前端学习笔记[1] 1. this在 JavaScript 中主要有以下五种使用场景 在全局函数调用中,this 绑定全局对象,浏览器环境全 ...
随机推荐
- 【JUnit4.10来源分析】6 Runner
org.junit.runner.Runner它是JUnit作业引擎.它在许多类型的支持下的.处理试验和生产(Description).Failure和Result和其它输出. Runner参见图主类 ...
- Spring FrameWork4(MVC + IOC)高速入门实例
使用Maven创建project并配置依赖项 首先创建一个Maven Project: 然后选择创建Maven 的webapp实例,当然也能够通过命令行方式创建Maven webapp的项目再转化并导 ...
- 使用autoconf和automake生成Makefile文件(转)
Makefile好难写 曾经也总结了一篇关于Makefile的文章<make和makefile的简单学习>.但是,总结完以后,发现写Makefile真的是一件非常痛苦的事情,的确非常痛苦. ...
- 聪明的kk
聪明的kk 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描写叙述 聪明的"KK" 非洲某国展馆的设计灵感源于富有传奇色彩的沙漠中陡然起伏的沙丘.体现出本 ...
- 于linux已安装moodle
本文介绍了两个虚拟机的安装linux server 及相关服务,随着后这些基础.安装应用程序服务 moodle 2.7+ 它是使用最广泛的平台,网络课程. 在安装过程中moodle之前,需要支持软件 ...
- Android CTS測试Fail项改动总结(四)
Android5.1上的測试 1.android.security.cts.SELinuxDomainTest# testInitDomain fail 打印的log junit.framework. ...
- 怎么样ubuntu 64 11.04 在执行32位程序
上网一查非常多的信息,头发上的今天ubuntu 64 11.04 在执行32位程序安装ia32-libs包,可执行例如,下面的命令.但提示无法安装 apt-get install ia32-libs ...
- 这个夏天不AC(杭州电2037)
这个夏天不AC Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Su ...
- ProgressDialog(三)——代号为中心的屏幕上显示ProgressDialog(ProgressBar)
MainActivity如下面: package cc.testprogressdialog; import android.os.Bundle; import android.view.Gravit ...
- Oracle 中用一个表的数据更新另一个表的数据
Oracle 中用一个表的数据更新另一个表的数据 分类: SQL/PLSQL2012-05-04 15:49 4153人阅读 评论(1) 收藏 举报 oraclemergesubqueryinsert ...