JQuery中遍历DOM元素each(callback)函数

最新推荐文章于 2022-12-03 21:52:12 发布

yaoshengting

最新推荐文章于 2022-12-03 21:52:12 发布

阅读量4.1k

点赞数

分类专栏： JQuery 文章标签： callback each jquery function string html

本文链接：https://blog.csdn.net/ystyaoshengting/article/details/6699418

版权

JQuery 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

each(callback):
以每一个匹配的元素作为上下文来执行一个函数。
意味着，每次执行传递进来的函数时，函数中的this关键字都指向一个不同的DOM元素（每次都是一个不同的匹配元素）。
而且，在每次执行函数时，都会给函数传递一个表示作为执行环境的元素在匹配的元素集合中所处位置的数字值作为参数（从零开始的整形）。

返回 'false' 将停止循环 (就像在普通的循环中使用 'break')。返回 'true' 跳至下一个循环(就像在普通的循环中使

用'continue')。

例子如下：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">
<title> 遍历元素</title>
  <script src="js/jquery.js" type="text/javascript"></script>
    
<style type="text/css">
  body{font-size:13px}
  img{border:solid 1px #ccc;padding:3px;margin:5px;width:143px;height:101px}
</style>
<script type="text/javascript">
  $(function() {
   $("img").each(function(index){
    // 根据形参index 设置元素的title 属性
    this.title = " 第" + index +" 幅风景图片，alt 内容是" + this.alt;
    if(i==1)
     return false;
   })
  })
</script>
</head>
<body>
<p>
  <img title="picture0" src="images/img05.jpg" alt=" 第0 幅风景画" />
  <img title="picture1" src="images/img06.jpg" alt=" 第1 幅风景画" />
  <img title="picture2" src="images/img07.jpg" alt=" 第2 幅风景画" />
</p>
</body>
</html>