jquery.filter() 实现元素前3个显示,其余的隐藏
<head>
<meta charset="UTF-8">
<title></title>
<style>
li {
display: none;
}
</style>
</head>
<body>
<ul>
<li class="info">1</li>
<li>2</li>
<li class="info">3</li>
<li class="info">4</li>
<li>5</li>
<li>6</li>
</ul>
<script src="jquery-3.3.1.min.js"></script>
<script>
$("li").filter(":lt(3)").show().end().filter(":gt(2)").hide()
解析:
index值从 0 开始。
:lt 选择器选取带有小于指定 index 值的元素。
:gt 选择器来选取 index 值大于指定数的元素。
// filter() 返回匹配的元素
$("li").filter(".info").show(); // 1 3 4 显示
// not() 返回不匹配的元素
$("li").not(".info").show() // 2 5 6显示
</script>
</body>
jquery.filter() 实现元素前3个显示,其余的隐藏的更多相关文章
- jQuery判断当前元素显示状态并控制元素的显示与隐藏
1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible'); //true为显示,false为隐藏 $("#id") ...
- 通过jquery获得某个元素的位置, 透明div, 弹出框, 然后在旁边显示toggle子级联菜单-hover的bug解决
jquery的"筛选选择器", 都是用冒号开头的, 即, 冒号选择器就是 筛选选择器.如: :first, :last, :eq(index), :first-child,...等 ...
- 转:Jquery如何获取某个元素前(后)的文本内容?
原文:[解决]Jquery如何获取某个元素前(后)的文本内容? <span> text here... <a id="target_element">百万创 ...
- jquery根据(遍历)html()的内容/根据子元素的内容(元素文本)来选择(查询),在子元素前加入元素
<ul> <li>First</li> <li>second</li> <li>third</li> </ul ...
- 教你三种jQuery框架实现元素显示及隐藏动画方式
摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...
- jquery可见性选择器(匹配匹配所有显示的元素)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery学习笔记----元素筛选
1.eq() 筛选指定索引号的元素2.first() 筛选出第一个匹配的元素3.last() 筛选出最后一个匹配的元素4.hasClass() 检查匹配的元素是否含有指定的类5.filter() 筛 ...
- jQuery基础(动画篇 animate,显示隐藏,淡入淡出,下拉切换)
1.jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元 ...
- Javascript JQuery获取当前元素的兄弟元素/上一个/下一个元素(转)
var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; //获得s的下一个 ...
随机推荐
- Spring Boot 2.x(五):整合Mybatis-Plus
简介 Mybatis-Plus是在Mybatis的基础上,国人开发的一款持久层框架. 并且荣获了2018年度开源中国最受欢迎的中国软件TOP5 同样以简化开发为宗旨的Spring Boot与Mybat ...
- Springboot 系列(三)Spring Boot 自动配置原理
注意:本 Spring Boot 系列文章基于 Spring Boot 版本 v2.1.1.RELEASE 进行学习分析,版本不同可能会有细微差别. 前言 关于配置文件可以配置的内容,在 Spring ...
- 百度图片objURL解密vb.net版
Function Baidtu_Uncomplie(k As String) As String Dim c = {"_z2C$q", "_z&e3B" ...
- PHP中private、public、protected的区别详解
先简单粗俗的描述下:public 表示全局,类内部外部子类都可以访问:private表示私有的,只有本类内部可以使用:protected表示受保护的,只有本类或子类或父类中可以访问: 再啰嗦的解释下: ...
- JavaScript_01简介,基本语法,运算符
JavaScript(不是JScript和scriptease) 1.js分为内部引用和外部引用,无论是内部引用还是外部引用,都可以放在html(除标签内)的任意位置,但是定义的位置会影响执行的顺序 ...
- 【.Net Core】ZipFile类--文件的压缩解压
NuGet引用官网自带的System.IO.Compression.ZipFile; var filename = "测试压缩解压文件"; var path = Directory ...
- es6的let,const
1.es6 新增的let const 命令 let用来定义一个局部变量,故名思意就是只在当前代码块可用 1.1 let 声明的变量不存在变量提升(var 声明的变量存在变量提升)且代码块内 暂时性死区 ...
- Selenium自动化-入门1
起初写博客是为了妹子学习,现在发现忽略了最基础的Selenium教程,所以:从本博客开始编辑 Selenium 入门知识.(学好Java) Selenium 入门 1:(学好Java) 录制回放,简单 ...
- JS、CSS中的相对路径
css中url(../images/1.jpg)路径是相对于index.css的 js中url(images/1.jpg)路径是相对于index.html的,并不是相对于index.js
- 使用GRPC远程服务调用
远程过程调用(英语:Remote Procedure Call,缩写为 RPC)是一个计算机通信协议.该协议允许运行于一台计算机的程序调用另一台计算机的子程序,而程序员无需额外地为这个交互作用编程.如 ...