jQuery选择元素下标以及通过元素下标获得dom

最新推荐文章于 2021-11-24 16:51:15 发布

圆圆01

最新推荐文章于 2021-11-24 16:51:15 发布

阅读量2.3k

点赞数 2

分类专栏： jQuery和layui JavaScript 文章标签： javascript jquery

本文链接：https://blog.csdn.net/weixin_45844049/article/details/103167048

版权

JavaScript 同时被 2 个专栏收录

46 篇文章 17 订阅

订阅专栏

jQuery和layui

5 篇文章 0 订阅

订阅专栏

正文

jQuery选择元素下标 $(this).index()
注：本文的两个方法index值均从0开始；
使用如下

<ul>
	<li>Coffee</li>
	<li>Milk</li>
	<li>Soda</li>
</ul>

$(document).ready(function(){
  $("li").click(function(){
    alert($(this).index());
  });
});

通过元素下标获得dom
写法一： $(“p:eq(1)”)
写法二： $(‘p’).eq(index)
两个写法是实现的功能是一样的，都是通过元素下标获得dom。
需要强调的是，在我们需要把变量作为下标的时候，推荐使用方法二 $(‘p’).eq(index)，方法一则需要字符串拼接，这方面如果有问题，请看这篇博客：jQuery选择器 :eq() 不能识别变量的问题解决方案

$("p:eq(1)") //选择第二个 <p> 元素
			 // 注：该方法如过想使用变量来作为下标，则需要字符串拼接，这个时候就需要

使用如下

<script type="text/javascript"> 
	$(document).ready(function(){
	    $("p:eq(1)").css("background-color","#B2E0FF");
	});
</script>	
<body>
	<h1>Welcome to My Homepage</h1>
	<p class="intro">My name is Donald</p>
	<p>I live in Duckburg</p>
	<p>My best friend is Mickey</p>
	<div id="choose">
	Who is your favourite:
	</div>
</body>

效果如图
效果图

其实这应该写在layui的分类下，因为，layui的tabs标签页切换的位置不可以设置在侧边，好吧，我只好自己写一个tabs切换。目前我了解到的，可以使用以上方法来实现tabs标签页
jQuery真的太强大了

结尾

我是圆圆，如果我的文章对你的学习成长有所帮助，欢迎点赞 👍 支持，您的点赞 👍 支持是我进行创作和分享的动力！

如果有问题可以留言评论或者私信我，我都会一一解答~笔芯🤞

圆圆01

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
jQuery选择元素下标以及通过元素下标获得dom

jQuery选择元素下标$(this).index() //注：本文的两个方法index值均从0开始；使用如下<ul> <li>Coffee</li> <li>Milk</li> <li>Soda</li></ul>$(document).ready(function(){ $(...
复制链接

扫一扫