jQuery中each()方法用法实例

2019/6/29 22:32:01

编程Tag： 方法 jQuery each

本文主要是介绍jQuery中each()方法用法实例，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

本文实例讲述了jQuery中each()方法用法。分享给大家供大家参考。具体分析如下：

此方法可以以匹配元素集合中每一个元素作为上下文去执行一个函数。

当每次执行函数时，函数的执行环境都是一个匹配元素集合中不同的DOM元素，并且会将此元素在集合中索引传递给此函数，索引值是从0开始的。通过返回false可用于提早停止循环运行，返回true将继续执行函数，直到匹配元素中每一个元素都遍历完成。
each()方法不同于jQuery.each()方法。each()方法只能够遍历JQuery对象，而jQuery.each()方法可以遍历任何对象。
语法结构:

复制代码代码如下:

$(selector).each(function(index,element))

参数列表:

参数	描述
function(index,element)	每个匹配元素定义运行的方法。 index - 可选。当前上下文元素在匹配元素集合中的索引。 element -可选。当前的元素（也可使用 "this" 选择器）。

实例代码:

复制代码代码如下:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="//www.zyiz.net/" />

<title>each()函数-找一找教程网</title>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

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

  $("li").each(function(index,element){

    alert($(element).text())

  })

})

})

</script>

</head>

<body>

<ul>

  <li>后台专区</li>

  <li>前台专区</li>

  <li>数据库专区</li>

  <li>站长专区</li>

</ul>

<button id="btn">点击查看效果</button>

</body>

</html>

以上代码能够便利li元素集合中的每一个元素，然后返回li元素中的文本。

希望本文所述对大家的jQuery程序设计有所帮助。

这篇关于jQuery中each()方法用法实例的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！

jQuery中each()方法用法实例

相关编程文章