关于JQuery获取元素索引值的理解

举例:

<html>
<body>
<div id="text">
	<div>
		<a><span>标题一</span></a>
		<p>文段一</p>
	</div>
	<div>
		<a><span>标题二</span></a>
		<p>文段二</p>
	</div>
	<div>
		<a><span>标题三</span></a>
		<p>文段三</p>
	</div>
	<div>
		<a><span>标题四</span></a>
		<p>文段四</p>
	</div>
	<div>
		<a><span>标题五</span></a>
		<p>文段五</p>
	</div>
</div>
</body>
</html>

错误写法:

<script>
$("#text div").click(function() {
	var index = $(this).index();
	alert(index);
</script>

以上,是获取不了正确的索引值的,返回值一直为0。

正确写法:

<script>
$("#text div").click(function() {
	var index = $("#text div").index(this);
	alert(index);
</script>

原因:对于elsement.index()产生误解,以为$(this)就是当前元素,而index()就可以获得它在同辈元素中的索引号,然而,必须先指定这个元素原先所在的集合,才可以获得这个元素的索引。

时间: 2025-01-02 16:06:33

关于JQuery获取元素索引值的理解的相关文章

jquery获取元素索引值index()

jquery获取元素索引值index()方法实例. jquery获取元素索引值index()方法: jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置. 如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置. 如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置.如果找不到匹配的元素,则

jquery获取元素索引

昨个项目中遇到的问题,想获取指定td在该行tr中可见列的索引: 由于改行tr下有隐藏元素,取索引的时候直接用 $(['td[name="operation"]').index() 取到的值肯定是不正确的: 查了一下资料,复习了下 index([selector|element]) 的用法. 现举例结合实际分享下. 先上效果图: 用几种不同的方式获取索引: 取#bar在ol下li中的索引: $("#bar").index();           // 输出0 取#b

jquery获取当前元素索引值index()方法(总结)

jquery的index()方法 搜索匹配的元素,并返回相应元素的索引值,从0开始计数. 如果不给 .index() 方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置.如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置.如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置.如果找不到匹配的元素,则返回-1. 1 <ul> 2 <li id="foo">foo<

解析JQuery中css()方法,获取元素CSS值之getComputedStyle方法(转载,写的很好)

一.碎碎念~前言 我们都用过jQuery的CSS()方法,其底层运作就应用了getComputedStyle以及getPropertyValue方法. 对于那些只想混口饭吃的人来讲,晓得CSS()如何使用就足够了.对于希望在JS道路上越走越远的来人说,简单了解一些JS库底层实现对自己的学习很有帮助.可能谈不上信手拈来的使用,至少对创造一些创意新颖的新技术拓宽了思路. jQuery为何受欢迎,其中原因之一就是方法名称比较短.好比打架一样,块头大的潜意识认为厉害,就不由得心生畏惧,退避三舍:小个子(

JQuery获取元素的方法总结

JQuery获取元素的方法总结 一.说明   获取元素的方法分为两种:jQuery选择器.jQuery遍历函数. 做个总结,巩固下知识. 二.获取本身 1.只需要一种jQuery选择器   选择器 实例 说明 #Id $('#myId') ID选择器: 可以获取到ID为"myId"的元素,区分大小写 2.多种jQuery选择器组合 分为两部分:前半部分获取到的是一个元素集合,后半部分可以精确为一个元素,两者相结合,可以获取到想要的元素. 1)前半部分选择器   选择器 实例 说明 .c

Jquery获取元素方法

Jquery 获取元素的方法分为两种:jQuery选择器.jQuery遍历函数. 1.获取本身: a.只需要一种jQuery选择器 选择器 实例 说明 #Id $('#myId') ID选择器: 可以获取到ID为"myId"的元素,区分大小写 b.多种jQuery选择器组合 b1.jQuery选择器 选择器 实例 说明 .class $('.myClass') 类选择器:可以获取到class为'myClass'的所有元素 element $('p') 获取所有的<p>元素

JavaScript or jQuery 获取option value值 以及文本内容的方法

1.html <div class="form-group"> <label>保险公司</label> <select class="form-control" id="testSelect"> <option value="平安">平安保险</option> <option value="太平洋">太平洋保险</op

jquery 获取textarea文本值详解

今天用jquery获取textarea文本值,遇到这么一个问题: 一开始用val()方法报错,后面使用text(),可以运行,但是获取的值永远为空,最后在改成val(),可以正常使用. 于是乎:为了把这个问题弄清楚,开始了遥远的解读jQuery源码之旅 步骤: 1. 给textarea设置默认值,分别输出text()和value()值 2. 改变textarea的文本值,在分别输出text()和value()值 例子: 代码: 1 <!doctype html> 2 <html lang

js/jquery获取元素,元素筛选器

1.js获取元素 var test = document.getElementById("test"); var parent = test.parentNode; // 父节点 var chils = test.childNodes; // 全部子节点 var first = test.firstChild; // 第一个子节点 var last = test.lastChile; // 最后一个子节点 var previous = test.previousSbiling; //