jquery的gt跟lt选择器用法

最新推荐文章于 2022-11-02 00:05:55 发布
最新推荐文章于 2022-11-02 00:05:55 发布
阅读量4.6k 收藏 2
点赞数
分类专栏： javaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wzx735481897/article/details/52980475
版权
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>gt与lt用法</title>
<style>
li
{
list-style-type: none;
}
li a
{
text-decoration:none;
}
</style>

<script type="text/javascript" src="scripts/jquery-1.3.1.js" ></script>
<script>

// gt(num):大于num的index值
// lt(num):在gt的基础上小于num的index值

$(function(){

$("a:gt(5):lt(8)").css("color","aqua");
$("i:gt(5):lt(8)").css("color","aqua");
})

</script>
</head>
<body>
<ul class="ul">
<li ><a href="#">佳能</a><i>(30440) </i></li>
<li ><a href="#">索尼</a><i>(27220) </i></li>
<li ><a href="#">三星</a><i>(20808) </i></li>
<li ><a href="#">尼康</a><i>(17821) </i></li>
<li ><a href="#">松下</a><i>(12289) </i></li>
<li ><a href="#">卡西欧</a><i>(8242) </i></li>
<li ><a href="#">富士</a><i>(14894) </i></li>
<li ><a href="#">柯达</a><i>(9520) </i></li>
<li ><a href="#">宾得</a><i>(2195) </i></li>
<li ><a href="#">理光</a><i>(4114) </i></li>
<li ><a href="#">奥林巴斯</a><i>(12205) </i></li>
<li ><a href="#">明基</a><i>(1466) </i></li>
<li ><a href="#">爱国者</a><i>(3091) </i></li>
<li ><a href="#">其它品牌相机</a><i>(7275) </i></li>
</ul>
</body>
</html>
吴泽雄
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
jQuery中:lt选择器用法实例
12-09
本文实例讲述了jQuery中:lt选择器用法。分享给大家供大家参考。具体分析如下： 此选择器匹配所有小于给定索引值的元素。 索引值最小是从0开始的。 语法结构: 代码如下:$(“:lt(index)”) 此选择器一般也要和其他选择器配合使用，比如类选择器和元素选择器等等。 例如: 代码如下:$(“li:lt(3)”).css(“color”,”blue”) 以上代码能够将索引小于3的li元素中的字体颜色设置为蓝色。 如果不和其他选择器配合使用，则默认状态是和*选择器配合使用，例如$(“:lt”)等同于$(“*:lt”)。 参数列表: 参数 描述 index 给定的索引值。
jquery 选择器 :lt(n)
KAXU
12-19 137
:lt(n) 匹配集合里索引在n之前的元素集合。返回匹配元素集合 &lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;scri...
jquery lt选择器与gt选择器
sinolzeng的专栏
09-22 1482
:lt 选择器选取带有小于指定 index 值的元素。 index 值从 0 开始。 经常与其他元素/选择器一起使用，来选择指定的组中特定序号之前的元素。 语法
关于选择器gt lt在一起时的用法
Seekarmor的网上记事本
08-17 885
gt和lt在一起用时,应该是有一定的顺序的如下$("td:lt(24):gt(11)",context).bind("click",showCommonDig);//有效$("td:gt(11):lt(24)",context).bind("click",showCommonDig);//无效  本文来自CSDN博客，转载请标明出处：http://blog.csdn
jQuery学习: lt与gt
m0_60527552的博客
10-02 889
:lt (less than)选择器选取带有小于指定 index 值的元素。 :gt (greater than)选择器选取 index 值高于指定数的元素。 两者的index值都是从0开始,代码用法如下: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;lt与gt&lt;/title&gt; &lt;script src="js/jquery-3.6.0.j
jQuery中:button选择器用法实例
12-03
本文实例讲述了jQuery中:button选择器用法。分享给大家供大家参考。具体分析如下： 此选择器能够选取所有按钮。 语法结构: 代码如下:$(“:button”) 实例代码: 代码如下: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;...
jQuery中:input选择器用法实例
12-10
本文实例讲述了jQuery中:input选择器用法。分享给大家供大家参考。具体分析如下： 此选择器匹配所有的input元素。例如：&lt;input type=”text” /&gt;等等 语法结构: 代码如下:$(“:input”) 实例代码: 代码如下:...
jQuery中:file选择器用法实例
12-08
本文实例讲述了jQuery中:file选择器用法。分享给大家供大家参考。具体分析如下： 此选择器能够选取类型为file的&lt;input&gt;元素。 语法结构: 代码如下:$(“:file”) 实例代码: 代码如下: &lt;!DOCTYPE html&gt; &lt...
JQuery中$之选择器用法介绍
12-11
在jQuery 中$(“”)，这个语法等同于$(document.createElement(“span”)) ，这是一种用法，在选择元素的时候还会这样子的用：[attribute$=value]，匹配给定的属性是以某些值结尾的元素。下面举个例子来说明一下： ...
JQuery中属性过滤选择器用法实例分析
12-03
本文实例讲述了JQuery中属性过滤选择器用法。分享给大家供大家参考。具体如下： &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;...
jQuery中的gt和lt
qq_44884300的博客
04-18 445
jQuery中的gt和lt
jQuery :gt 选择器 jQuery :lt 选择器
weixin_34185512的博客
06-16 75
选择前 3 个之后的所有 &lt;tr&gt; 元素： $("tr:gt(2)"); 选择前 2 个 &lt;tr&gt; 元素： $("tr:lt(2)"); 转载于:https://www.cnblogs.com/mabelstyle/p/3790654.html
gt,gte,lt,lte 用法
weixin_30739595的博客
12-26 820
gt: greater than 大于 gte: greater than or equal 大于等于 lt: less than 小于 lte: less than or equal 小于等于 转载于:https://www.cnblogs.com/devin-sl/p/10177831.html
jQuery中gt和lt的使用
ammafree的专栏
09-19 6700
如下html： 1 2 3 4 5 6 7 执行js： $("a:gt(2):lt(2)").attr("href", "www.baidu.com"); 结果为： 1                     0 2                     1      3                     2 43     0 54     1
bigNumber.js
qq_41347964的博客
11-02 7074
BigNumber.js
笔记：jquery基础方法——lt(),gt(),eq()方法
qq_44604924的博客
04-20 4375
（1）lt():匹配所有小于给定索引值的元素,索引从0开始 例： 1 2 3 4 $(“tr:lt(3)”) 会找到表格中1，2，3的单元格。 （2）gt():匹配所有大于给定索引值的元素,索引从0开始 例： 1 2 3 4 $(“tr:gt(1)”) 会找到表格中3，4的单元格 （3）eq()方法：将匹配元素为指定给索引，索引从0开始 例： 1 2 3 4 $(“tr:eq(1)”) 会找...
层次选择器的用法html,jQuery层次选择器选择元素使用介绍
最新发布
06-06
层次选择器是一种选择HTML元素的方法，可以通过HTML元素之间的层次关系来选择指定的元素。在HTML中，元素的层次关系是通过父子关系、兄弟关系等方式来建立的。在jQuery中，可以使用层次选择器来选择指定的元素。 常用的层次选择器包括： 1. 后代选择器（Descendant Selector） 后代选择器用于选择指定元素的后代元素，语法格式为"ancestor descendant"，其中ancestor为祖先元素，descendant为后代元素。例如： ```html &lt;div&gt; &lt;p&gt;这是一个段落&lt;/p&gt; &lt;/div&gt; ``` 可以使用后代选择器选择p元素： ```css div p { color: red; } ``` 2. 子元素选择器（Child Selector） 子元素选择器用于选择指定元素的直接子元素，语法格式为"parent &gt; child"，其中parent为父元素，child为子元素。例如： ```html &lt;div&gt; &lt;p&gt;这是一个段落&lt;/p&gt; &lt;ul&gt; &lt;li&gt;列表项1&lt;/li&gt; &lt;li&gt;列表项2&lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; ``` 可以使用子元素选择器选择ul元素中的li元素： ```css div &gt; ul &gt; li { color: red; } ``` 3. 相邻兄弟选择器（Adjacent Sibling Selector） 相邻兄弟选择器用于选择指定元素的紧邻的后续兄弟元素，语法格式为"prev + next"，其中prev为前一个兄弟元素，next为后一个兄弟元素。例如： ```html &lt;ul&gt; &lt;li&gt;列表项1&lt;/li&gt; &lt;li&gt;列表项2&lt;/li&gt; &lt;li&gt;列表项3&lt;/li&gt; &lt;li&gt;列表项4&lt;/li&gt; &lt;/ul&gt; ``` 可以使用相邻兄弟选择器选择第二个li元素后紧邻的li元素： ```css li:nth-child(2) + li { color: red; } ``` 4. 通用兄弟选择器（General Sibling Selector） 通用兄弟选择器用于选择指定元素之后的所有兄弟元素，语法格式为"prev ~ siblings"，其中prev为前一个兄弟元素，siblings为后续所有兄弟元素。例如： ```html &lt;ul&gt; &lt;li&gt;列表项1&lt;/li&gt; &lt;li&gt;列表项2&lt;/li&gt; &lt;li&gt;列表项3&lt;/li&gt; &lt;li&gt;列表项4&lt;/li&gt; &lt;/ul&gt; ``` 可以使用通用兄弟选择器选择第二个li元素后的所有li元素： ```css li:nth-child(2) ~ li { color: red; } ``` 以上就是层次选择器的常用用法介绍，希望能够对你有所帮助。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值