jquery的index()方法
搜索匹配的元素,并返回相应元素的索引值,从0开始计数。
如果不给
index()
方法传递参数,那么返回值就是这个jQuery对象集合中第一个元素相对于其同辈元素的位置。
如果参数是一组DOM元素或者jQuery对象,那么返回值就是传递的元素相对于原先集合的位置。
如果参数是一个选择器,那么返回值就是原先元素相对于选择器匹配元素中的位置。如果找不到匹配的元素,则返回-1。
复制代码代码如下:
foo
bar
baz
$('li')index(documentgetElementById('bar'));
//1,传递一个DOM对象,返回这个对象在原先集合中的索引位置
$('li')index($('#bar'));
//1,传递一个jQuery对象
$('li')index($('li:gt(0)'));
//1,传递一组jQuery对象,返回这个对象中第一个元素在原先集合中的索引位置
$('#bar')index('li');
//1,传递一个选择器,返回#bar在所有li中的做引位置
$('#bar')index();
//1,不传递参数,返回这个元素在同辈中的索引位置。
jquery获取元素索引值index()示例
复制代码代码如下:
//用于二级或者三级联动
建站素材
jquery特效
懒人主机
前端路上
$("#nav
a")click(function(){
//四个经典的用法
var
index1
=
$("#nav
a")index(this);
var
index2
=
$("#nav
a")index($(this));
var
index3
=
$(this)index()
var
index3
=
$(this)index("a")
alert(index3);
return
false;
});
这样:
<script type="text/javascript">
$(function () {
$("#div1")next()addClass("am-active"); 获得div1的下一个元素
$("#div1")next()find("dd")addClass("am-in"); 获得div1下一个元素的 指定子元素
})
</script>
扩展资料:
注意事项
通常,选择一个元素很简单,$("#id")就可以搞定,但是如果想选择某个id为x1的div下的某个id为x2的元素就很困难了,可以通过用find来解决这个问题。
例如:
html代码如下:
<div id="test">
<div id="div1">第一行</div>
<div id="div2">
<p id="p1">第1行</p>
<p id="p2">第2行</p>
<p id="p3">第3行</p>
</div>
<div id="div3">第三行</div>
</div>
jQuery 选择器中 :last 表示最后一个元素,所以表示含有某类属性的最后一个元素可用如下代码表示
$("test-class:last") // 表示最后一个属于test-class类的元素示例如下:
创建Html元素
<div class="top"><ul>
<li>list-1</li>
<li class="selected">list-2</li>
<li class="selected">list-3</li>
<li>list-4</li>
<li class="selected">list-5</li>
</ul>
<span>红色列表项表示属于selected类,d出框显示了最后一个属于selected类的元素的内容</span>
</div>
设置css样式
divtop{margin:50px;padding:10px;width:300px;height:250px;border:2px dashed #ebbcbe;}li{padding:5px;}
liselected{color:red;font-weight:bold;}
span{color:#999;}
编写jquery代码
$(function(){$("ul")click(function() {
alert($("liselected:last")text());
});
})
观察显示效果
1、查找子元素方式1:>
例如:var
aNods
=
$("ul
>
a");查找ul下的所有a标签
2、查找子元素方式2:children()
3、查找子元素方式3:find()
通过下标获取第n个子标签的ID值
1var
num1=$("ul
>
a:eq(0)")attr("ID");
2var
num2=$("ul")children("a:eq(0)")attr("ID");
3var
num3=$("ul")find("a:eq(0)")attr("ID");
$(function(){//相当天body的 onload,要等页页面加载完毕后才能找到iframe
$("#hong")contents()find("body")append("I'm in an iframe!");
});
</script>
<iframe width="1198" height="729" name="hong" id="hong" src="" scrolling="no" style="text-align:center"></iframe>
jQuery 的 index() 方法返回指定元素相对于其他指定元素的索引值,注意:索引值是从0开始计数的。获得当前元素的索引值可用click事件触发
示例代码如下:获取被点击的a标签的索引值
1,创建Html元素
2,设置css样式
3,编写jquery代码
4,观察效果:因为index从0开始计数,所以点击第三个元素,获取的索引值是2
扩展资料
jQuery的核心特性:
1,具有独特的链式语法和短小清晰的多功能接口;
2,具有高效灵活的css选择器,并且可对CSS选择器进行扩展;
3,拥有便捷的插件扩展机制和丰富的插件。
4,jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。
参考资料:
以上就是关于jquery中怎么获得特定元素的索引值全部的内容,包括:jquery中怎么获得特定元素的索引值、jquery获取指定元素下的子元素、JQUERY怎么获取一个类中的最后一个元素。等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)