jQuery中:lt选择器作用是什么，用法是怎样
导读：这篇文章给大家分享的是“jQuery中:lt选择器作用是什么，用法是怎样”，文中的讲解内容简单清晰，对大家认识和了解都有一定的帮助，对此感兴趣的朋友，接下来就跟随小编一起了解一下“jQuery中:lt选择器作用是什么，用法是怎样”吧。...
这篇文章给大家分享的是“jQuery中:lt选择器作用是什么，用法是怎样”，文中的讲解内容简单清晰，对大家认识和了解都有一定的帮助，对此感兴趣的朋友，接下来就跟随小编一起了解一下“jQuery中:lt选择器作用是什么，用法是怎样”吧。
本文实例讲述了jQuery中:lt选择器用法。分享给大家供大家参考。具体分析如下：
此选择器匹配所有小于给定索引值的元素。
索引值最小是从0开始的。
语法结构:
$(":lt(index)")
此选择器一般也要和其他选择器配合使用，比如类选择器和元素选择器等等。
例如:
以上代码能够将索引小于3的li元素中的字体颜色设置为蓝色。
如果不和其他选择器配合使用，则默认状态是和*选择器配合使用，例如$(":lt")等同于$("*:lt")。
参数列表:
| 参数 | 描述 |
| index | 给定的索引值。 |
实例代码:
实例一:
!DOCTYPE html>
html>
head>
meta charset=" utf-8">
meta name="author" content="//www.jb51.net/" />
title> 码农之家/title>
script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"> /script>
script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("li:lt(3)").css("color","blue");
} );
} )
/script>
/head>
body>
ul>
li> html专区/li>
li> div+css专区/li>
li> jQuery专区/li>
li> Javascript专区/li>
/ul>
button id="btn"> 点击查看效果/button>
/body>
/html>
以上代码可以将li元素集合中，索引值小于3的li元素中的字体颜色设置为蓝色。
实例二:
!DOCTYPE html>
html>
head>
meta charset=" utf-8">
meta name="author" content="//www.jb51.net/" />
title> 码农之家/title>
script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"> /script>
script type="text/javascript">
$(document).ready(function(){
$("#btn").click(function(){
$("*").each(function(){
alert(this.tagName);
} )
} )
$("#show").click(function(){
$(":lt(11)").css("border","1px solid red");
} )
} );
/script>
/head>
body>
ul>
li> html专区/li>
li> div+css专区/li>
li> jQuery专区/li>
li> Javascript专区/li>
/ul>
button id="btn"> 遍历所有元素/button>
button id="show"> 点击查看选择器效果/button>
/body>
/html>
由于以上代码并没有指定与:lt选择器相配合使用的选择器，所以就默认和*选择器配合使用，于是以上代码可以将当前文档中所有元素中索引值小于11的的元素的边框颜色设置为红色。
通过以上内容的阐述，相信大家对“jQuery中:lt选择器作用是什么，用法是怎样”已经有了进一步的了解，更多相关的问题，欢迎关注网络或到官网咨询客服。
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： jQuery中:lt选择器作用是什么，用法是怎样
本文地址： https://pptw.com/jishu/654686.html