详解获取jq ul第一个li定位的四种解决方案
更新时间：2016年11月23日 11:43:48 作者：川哥哥
本篇文章主要介绍了多个ul中获取第一个li定位的四种解决方案，需要的朋友可以过来参考下
如果我们只是获取一个ul中的第一个li的话，那么我们可以这样写：
$("ul li:first");
$("ul li").eq(0);
$("ul li").first();
$("ul li").slice(0,1);//slice第一个参数表示的选取开始的位置，第二个参数是结束的位置
<ul> <li>安哲</li> <li>安哲</li> <li>安哲</li> <li>安哲</li> </ul> <ul> <li>安哲</li> <li>安哲</li> <li>安哲</li> <li>安哲</li> </ul> <ul> <li>安哲</li> <li>安哲</li> <li>安哲</li> <li>安哲</li> </ul> <ul> <li>安哲</li> <li>安哲</li> <li>安哲</li> <li>安哲</li> </ul>
解决方案我大概写了四种
<script type="text/javascript">
//方案一
$(function(){
var list=$("ul");
for (var i = 0; i < list.length; i++) {
$("ul:eq("+i+") li:first").css("background","red");
}
});
//方案二
/*$(function(){
$("ul").each(function(){
$(this).children().first().css("background","red");
});
});*/
//方案三
/*$(function(){
$("ul li:nth-child(1)").css("background","red");
});*/
//方案四
/*$(function(){
$("ul li:first-child").css("background","red");
});*/
</script>
运行结果
以上就是本文的全部内容，希望对大家有所帮助，谢谢对脚本之家的支持！
相关文章
jquery中的queue和dequeue是一组很有用的方法，他们对于一系列需要按次序运行的函数特别有用。特别animate动画，ajax，以及timeout等需要一定时间的函数2014-03-03
最近做项目遇到这样的需求，要求基于jq判断网页是否已经滚动到浏览器底部了，下面小编给大家分享实例代码，需要的朋友参考下吧2017-10-10
这篇文章主要介绍了jQuery操作cookie的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-06-06
这篇文章主要介绍了jQuery获取单击节点对象的方法,涉及jQuery操作鼠标事件与页面元素的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2016-06-06
这篇文章主要介绍了jQuery中prev()方法用法,实例分析了prev()方法的功能、定义及取得匹配元素集合中每个元素紧邻的前一个同辈元素使用技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了jQuery中parentsUntil()方法用法,实例分析了parentsUntil()方法的功能、定义及根据条件查找匹配元素的所有的祖先元素使用技巧,需要的朋友可以参考下2015-01-01
本文主要介绍了jquery实现多次上传同一张图片的方法。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要为大家分享了jquery单击和双击事件冲突解决方案，感兴趣的小伙伴们可以参考一下2016-03-03
这篇文章主要介绍了jQuery实用函数用法总结,汇总了jQuery常用的函数及相关技巧,需要的朋友可以参考下2014-08-08
用jQuery将JavaScript对象转换为querystring查询字符串的方法
这篇文章主要介绍了用jQuery将JavaScript对象转换为querystring查询字符串的方法，本文给大家分享两种方法，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下2018-11-11
最新评论