1、选择器+遍历

$('div').each(function (i){

i就是索引值

this 表示获取遍历每一个dom对象

});

2、选择器+遍历

$('div').each(function (index,domEle){

index就是索引值

domEle 表示获取遍历每一个dom对象

});

3、更适用的遍历方法

1)先获取某个集合对象

2)遍历集合对象的每一个元素

var d=$("div");

$.each(d,function (index,domEle){

d是要遍历的集合

index就是索引值

domEle 表示获取遍历每一个dom对

});

案例:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>属性选择器学习</title>

<script language="JavaScript" type="text/javascript" src="../include/jQuery.js"></script>

<script language="javascript" type="text/javascript">

//使用jquery加载事件

$(document).ready(function (){

//<input id="btn0" type="button" value="利用jquery对象实现 修改表单中可见的文本域的值  $('input[type=text]:enabled')" />

$("#btn0").click(function (){

//当点击按钮后,设置id=two的div的背景颜色是绿色

$("input[type=text]:enabled").each(function(index,domEle){

//domEle.value="xxxxx";

$(domEle).val("xxxxxxxx");

});

});

//<input id="btn1" type="button" value="利用jquery对象实现 修改表单中不可修改的文本域的值  $('input[type=text]:disabled')" />

$("#btn1").click(function (){

//当点击按钮后,设置id=two的div的背景颜色是绿色

$("input[type=text]:disabled").each(function(index,domEle){

//domEle.value="xxxxx";

$(domEle).val("xxxxxxxx");

});

});

//<input id="btn2" type="button" value="利用jquery对象实现 获取选中的复选框的个数 $('input[type=checkbox]:checked')" />

$("#btn2").click(function (){

//当点击按钮后,设置id=two的div的背景颜色是绿色

alert($("input[type=checkbox]:checked").length);

/*

$("input[type=checkbox]:checked").each(function(index,domEle){

//alert(domEle.value);

//alert(this.value);

//alert($(this).val());

});

*/

});

//<input id="btn3" type="button" value="利用jquery对象实现 获取选中的下拉菜单的内容  $('select option:selected')" />

$("#btn3").click(function (){

//当点击按钮后,设置id=two的div的背景颜色是绿色

$("select option:selected").each(function(index,domEle){

//domEle.value="xxxxx";

alert($(domEle).text());

});

});

});

</script>

</head>

<body>

<form method="post" action="">

<input type="text" value="可见元素1"  />

<input type="text" value="不可见元素1" disabled="disabled"  />

<input type="text" value="可见元素2"  />

<input type="text" value="不可见元素2"  disabled="disabled" /><br>

<input type="checkbox" value="美女" />美女

<input type="checkbox" value="美男" />美男

<input type="checkbox" value="大爷" />大爷

<input type="checkbox" value="大妈" />大妈

<br>

<input type="radio" value="男" />男

<input type="radio" value="女" />女

<br>

<select id="zhiwei" size="5" multiple="multiple">

<option>PHP开发工程师</option>

<option>数据库管理员</option>

<option>系统分析师</option>

<option>保安</option>

</select>

<select id="xueli">

<option>大专</option>

<option>中专</option>

<option>小学</option>

</select>

</form>

<div style="clear:both;">

<input id="btn0" type="button" value="利用jquery对象实现 修改表单中可修改的文本域的值  $('input[type=text]:enabled')" /><br>

<input id="btn1" type="button" value="利用jquery对象实现 修改表单中不可修改的文本域的值  $('input[type=text]:disabled')" /><br>

<input id="btn2" type="button" value="利用jquery对象实现 获取选中的复选框的个数 $('input[type=checkbox]:checked')" /><br>

<input id="btn3" type="button" value="利用jquery对象实现 获取选中的下拉菜单的内容  $('select option:selected')" /><br>

</div>

</body>

</html>

jquery中each()的三种遍历用法的更多相关文章

  1. Jquery中each的三种遍历方法

    Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(dat ...

  2. Jquery中each的3种遍历方式

    学习目标: 参考博文: https://blog.csdn.net/honey_th/article/details/7404273 一.Jquery中each的几种遍历方法 1. 选择器+遍历 &l ...

  3. Java中Map的三种遍历方法

    Map的三种遍历方法: 1. 使用keySet遍历,while循环: 2. 使用entrySet遍历,while循环: 3. 使用for循环遍历.   告诉您们一个小秘密: (下↓面是测试代码,最爱看 ...

  4. jquery中each的3种遍历方法

    1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function  ...

  5. java中 this 的三种用法

    Java中this的三种用法 调用属性 (1)this可以调用本类中的任何成员变量 调用方法(可省略) (2)this调用本类中的成员方法(在main方法里面没有办法通过this调用) 调用构造方法 ...

  6. 空数组在以下三种遍历中均不可更改:forEach、map和for...in

    首先,我们要知道对于forEach.map和for...in三种遍历,在不是空数组的情况下,要想实现更改原数组的方法,代码如下: var list = [1,2,3,4]; var list1 = [ ...

  7. Java中List集合的三种遍历方式(全网最详)

    List集合在Java日常开发中是必不可少的,只要懂得运用各种各样的方法就可以大大提高我们开发的效率,适当活用各种方法才会使我们开发事半功倍. 我总结了三种List集合的遍历方式,下面一一来介绍. 首 ...

  8. PTA 二叉树的三种遍历(先序、中序和后序)

    6-5 二叉树的三种遍历(先序.中序和后序) (6 分)   本题要求实现给定的二叉树的三种遍历. 函数接口定义: void Preorder(BiTree T); void Inorder(BiTr ...

  9. 大数据学习day13------第三阶段----scala01-----函数式编程。scala以及IDEA的安装,变量的定义,条件表达式,for循环(守卫模式,推导式,可变参数以及三种遍历方式),方法定义,数组以及集合(可变和非可变),数组中常用的方法

    具体见第三阶段scala-day01中的文档(scala编程基础---基础语法)  1. 函数式编程(https://www.cnblogs.com/wchukai/p/5651185.html): ...

随机推荐

  1. python性能分析——insert()

    我们在list中插入数据时,经常使用这两个函数: append():在列表的末尾增加一个数据 insert():在某个特定位置前加一个数据 Python内的list实现是通过数组实现的,而不是链表的形 ...

  2. springboot+kotlin+springcloud+java+grade+maven混编?

    springboot + maven + java vs springboot + gradle + kotlin 快速搭建:https://start.spring.io/ springclould ...

  3. ios存储图片注意

    以下方法可以解决 ios不能长按图片保存到手机的问题 -webkit-touch-callout:default;

  4. MySQL Cursor Demo

    -- 使用cursor的demo -- ==============================## -- 删除存储过程 DROP PROCEDURE USP_TestCursor; DELIMI ...

  5. apache kafka系列之在zookeeper中存储结构

    1.topic注册信息 /brokers/topics/[topic] : 存储某个topic的partitions所有分配信息 Schema:   {    "version": ...

  6. 客户端代码压缩成zip和服务器开启gzip

     1.我说的zip是打包完的js代码,用压缩工具压缩为zip文件,这样放CDN上,下载量会进一步缩小,提高进入游戏的速度   嗯,需要在游戏页用js解压zip文件  2.最简单的就服务器开启gzip 

  7. Distributed processing

    Distributed processing Tool 好处 坏处 类型 支持序列化 支持根据负载动态调度任务 支持c 支持dependency的调度 有成熟的library Actor model ...

  8. Xshell配置SSH免密码登录

    思路: 私钥存放于客户端,id_rsa 将客户端公钥存放于要远程控制服务器上:将客户在公钥id_rsa.pub内容追加到 /root/.ssh/authorized_keys 使用密钥认证分3步: 1 ...

  9. Laravel $request添加数据或数据修改

    laravel开发项目的时候,很多时候我们从$request里获取请求参数,今天在做项目的时候,遇到这样一个需求,就是请求参数到后台,后台需要根据判断重新给$request赋值,那如何去处理的 使用  ...

  10. centos安装netcat

    Linux安装swoole后,测试UDP服务需要用到netcat,然而百度了很多安装方法,并没有一个好用的.几经尝试,终于安装成功,现在就分享给大家,以供参考. 配置环境:centos6.3 1.下载 ...