<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个显示，其余的隐藏的更多相关文章

  1. jQuery判断当前元素显示状态并控制元素的显示与隐藏

    1.jQuery判断一个元素当前状态是显示还是隐藏 $("#id").is(':visible');   //true为显示,false为隐藏 $("#id") ...

  2. 通过jquery获得某个元素的位置, 透明div, 弹出框, 然后在旁边显示toggle子级联菜单-hover的bug解决

    jquery的"筛选选择器", 都是用冒号开头的, 即, 冒号选择器就是 筛选选择器.如: :first, :last, :eq(index), :first-child,...等 ...

  3. 转：Jquery如何获取某个元素前(后)的文本内容？

    原文:[解决]Jquery如何获取某个元素前(后)的文本内容? <span> text here... <a id="target_element">百万创 ...

  4. jquery根据(遍历)html()的内容/根据子元素的内容（元素文本）来选择（查询），在子元素前加入元素

    <ul> <li>First</li> <li>second</li> <li>third</li> </ul ...

  5. 教你三种jQuery框架实现元素显示及隐藏动画方式

    摘要:在jQuery框架中对元素对象进行显示和隐藏有三种方式,分别是"默认方式显示和隐藏"."滑动方式显示和隐藏"."淡入淡出显示和隐藏". ...

  6. jquery可见性选择器（匹配匹配所有显示的元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. jquery学习笔记----元素筛选

    1.eq()  筛选指定索引号的元素2.first() 筛选出第一个匹配的元素3.last() 筛选出最后一个匹配的元素4.hasClass() 检查匹配的元素是否含有指定的类5.filter() 筛 ...

  8. jQuery基础（动画篇 animate，显示隐藏，淡入淡出，下拉切换）

    1.jQuery中隐藏元素的hide方法   让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元 ...

  9. Javascript JQuery获取当前元素的兄弟元素/上一个/下一个元素（转）

    var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; //获得s的下一个 ...

随机推荐

  1. 第37章 资源所有者密码验证(Resource Owner Password Validation) - Identity Server 4 中文文档(v1.0.0)

    如果要使用OAuth 2.0资源所有者密码凭据授权(aka password),则需要实现并注册IResourceOwnerPasswordValidator接口: public interface ...

  2. SQL Server表名为添加中括号[]执行出错

    执行SQL语句: Update Check Set EOBTypeID=102 where E0BID='123344' 结果竟然报错,给表名添加中括号,写成这样: Update [Check] Se ...

  3. Beanstalkd，zeromq，rabbitmq的区别

    1).rabbitmq(功能强大,管理应用也完善,不过也比较重量级)2).zeromq(从rabbitmq出来的一个小而快速的队列,基本是目前最快的队列机制,自身支持多种模式,可以对各个模式进行自己组 ...

  4. Java原型模式

    原型模式 原型模式也称克隆模式.原型模式jian ming zhi yi,就是先创造出一个原型,然后通过类似于Java中的clone方法,对对象的拷贝,克隆类似于new,但是不同于new.new创造出 ...

  5. laravel框架使用中错误及解决办法总结

    1.Laravel访问出错错误信息:`Warning: require(/vendor/autoload.php):failed to open stream: No such file or dir ...

  6. sublime实现背景透明化

    预览 老司机们就不要吐槽背景图了 实现方法 首先下载插件,直接打包下载zip即可 地址:https://github.com/vhanla/SublimeTextTrans 下载完成后解压到packa ...

  7. 2019-02-10 扩展Python控制台实现中文反馈信息

    "中文编程"知乎专栏原文地址 参考了周蟒的实现, 运行效果如下: $ python3 解释器.py Python 3.6.5 (v3.6.5:f59c0932b4, Mar 28 ...

  8. 常用matlab函数（不定时更新）

    直方图类: histc  直方图分组  示例 histc(a,0:1:10)  意义:将a(矩阵或向量)分组,分组设置为 0-1 1-2 2-3 -.. 9-10,(10-11) 百分位 prctil ...

  9. iOS----------对单元格取余

    if (indexPath.row % 2 == 0) { cell.backgroundColor = [UIColor magentaColor]; }else{ cell.backgroundC ...

  10. 07-Vue的基础使用

    vue的介绍 前端框架和库的区别 nodejs的简单使用 vue的起步 指令系统 组件的使用 过滤器的使用 watch和computed 钩子函数 渐进式的JavaScript框架 vue react ...