首页 > 编程语言 > 详细

jQuery操作数组的工具方法

时间:2016-05-13 04:26:48      阅读:188      评论:0      收藏:0      [点我收藏+]

1.前言

很多时候,jQuery的$()函数都返回一个类似数组的jQuery对象,例如$(“div”)将返回由页面中所有<div…/>元素包装成jQuery对象,这个jQuery对象实际上包含了多个<div…/>元素对应的DOM对象。在这种情况下,jQuery提供了以下几个常用属性和方法来操作类数组的jQuery对象。

1)        length:该属性返回jQuery里包含的DOM元素的个数

2)        context:该属性返回获取jQuery对象传入的context参数

3)        jquery:该属性返回jQuery的版本

4)        each(fn(index)):该方法是一个迭代器函数,它将使用fn函数迭代处理jQuery里包含的每个元素。

5)        get():该方法返回由jQuery里包含的所有DOM元素组成 的数组

6)        get(index):该方法返回jQuery里包含的第index+1个DOM元素(第一个元素索引为0)。

7)        index(element|selector):该方法返回element元素(或匹配selector选择器的元素)在当下的程序示范了如何使用这些工具方法来操作类数组的jQuery对象。

2.例子

     下面程序示范了如何使用这些工具方法来操作类数组的jQuery对象。

<!DOCTYPE html>
<html>
<head>
	<meta name="author" content="OwenWilliam" />
	<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
	<title> 操作类数组的工具方法 </title>
</head>
<body>
<div>
	<div id="java">Java</div>
	<div id="javaee">Java EE</div>
	<div id="ajax">Ajax</div>
	<div id="xml">XML</div>
	<div id="ejb">Java EE企业应用</div>
	<div id="android">Android</div>
</div>
<script type="text/javascript" src="../jquery-1.8.0.js">
</script>
<script type="text/javascript">
// 获取div之内所有的div元素,并迭代处理每个元素
$("div>div").each(function(i)
{
	this.innerHTML += " 添加的内容" + i;
});
// 返回div之内的所有div元素的个数,下面将输出6
alert($("div>div").length);
// 获取div之内的第二个div元素,下面将输出“轻量级Java EE企业应用实战...”
alert($("div>div").get(1).innerHTML);
// 获取id为java的div元素。注意:$("#java").get()返回一个数组
alert($("#java").get()[0].innerHTML);
// 所有div元素之内,id为ejb的div的索引,下面将输出4.
alert($("div>div").index($("#ejb")));
</script>
</body>
</html>

3.结果

技术分享

jQuery操作数组的工具方法

原文:http://blog.csdn.net/owen_william/article/details/51339760

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!