实例

选中所有段落,然后将所选内容缩减为只包含第一和第二个段落:

.slice(0, 2)

亲自试一试

定义和用法

slice() 把匹配元素集合缩减为指定的指数范围的子集。

语法

.slice(selector,end)
参数 描述
selector

基于 0 的整数值,指示开始选取元素的位置。

如果是负数,则指示从集合末端开始的偏移量。

end

基于 0 的整数值,指示结束选取元素的位置。

如果是负数,则指示从集合末端开始的偏移量。

如果省略,则选取范围会在集合末端结束。

详细说明

如果给定一个表示 DOM 元素集合的 jQuery 对象,.slice() 方法用匹配元素的子集构造一个新的 jQuery 对象。已应用的 index 参数集合中其中一个元素的位置;如果省略 end 参数,则 index 之后的所有的所有元素都会包含在结果中。

请思考这个带有简单列表的页面:

<ul><li>list item 1</li><li>list item 2</li><li>list item 3</li><li>list item 4</li><li>list item 5</li>
</ul>

我们可以向列表项集合应用该方法:

.slice(2)

亲自试一试

此次调用的结果是项目 3、4 和 5 的背景被设置为红色。请注意,已应用的 index 参数基于零,引用的是 jQuery 对象中元素的位置,而非 DOM 树中的。

end 参数允许我们更进一步地限制选取范围。比如:

.slice(2, 4)

亲自试一试

现在,只有项目 3 和 4 会被选取。再次说明,index 是基于零的;范围会延伸到(但不包含)指定的 index。

负的指数

jQuery 的 .slice() 方法模仿了 JavaScript 数组对象的 .slice() 方法。它所模仿的特性之一是向 start 或 end 参数传递负数的能力。如果提供负数,则指示的是从集合结尾开始的一个位置,而非从开头。例如:

.slice(-2, -1)

亲自试一试

这次,只有列表项 4 会变红,这是因为该项目是介于从结尾计数的二 (-2) 与从结尾计数的一 (-1) 的之间的范围中的唯一项目。

jQuery 遍历 - slice() 方法相关推荐

  1. jquery遍历多个li_21个jQuery遍历节点方法详解

    本篇教程介绍了21个jQuery遍历节点方法详解,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入. < 1.children()方法:$('div').children( ...

  2. jQuery中slice()方法用法实例

    本文实例讲述了jQuery中slice()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以选取匹配元素集的子集. 语法结构: 复制代码 代码如下: $(selector).slice(sta ...

  3. jQuery 遍历 - closest() 方法

    jQuery 遍历参考手册 实例 本例演示如何通过 closest() 完成事件委托.当被最接近的列表元素或其子后代元素被点击时,会切换黄色背景: $( document ).bind("c ...

  4. jQuery 遍历 - children() 方法

    jQuery 遍历参考手册 实例 找到类名为 "selected" 的所有 div 的子元素,并将其设置为蓝色: $("div").children(" ...

  5. jQuery 遍历 - prev() 方法

    定义和用法 prev() 获得匹配元素集合中每个元素紧邻的前一个同胞元素,通过选择器进行筛选是可选的. .prev(selector) 参数 描述 selector 字符串值,包含用于匹配元素的选择器 ...

  6. html遍历map,jQuery 遍历map()方法详解

    一.定义和用法 map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象. 二.语法 .map(callback(index,domElement)) 三.详细说明 ...

  7. jQuery 遍历 each()方法

    输出每个 li 元素的文本: $("button").click(function(){ $("li").each(function(){ alert($(th ...

  8. jQuery 遍历 - siblings()方法

    查找每个 p 元素的所有类名为 "selected" 的所有同胞元素: $("p").siblings(".selected") 转载于:h ...

  9. jquery遍历节点的方法

    jquery遍历节点方法总结: 后代遍历 children()方法返回被选元素的所有直接子元素. find()方法返回被选元素的后代元素,一路向下直到最后一个后代. 祖先遍历 parent()方法返回 ...

最新文章

  1. Alpha版本项目展示
  2. oracle中to_char的用法
  3. MVC 自定义分面控件
  4. go语音protobuf_golang 使用 protobuf 的教程
  5. 关于在MathType中内置样式的一些小知识
  6. Struts(十四):通用标签-form表单
  7. mac bash file密码_Mac系统 | 入门级程序员的开始:Hello word!
  8. 转载--Defunct僵尸进程
  9. 2021年上半年软考真题网络工程师真题及答案解析
  10. 游戏Gala—基于星际文件系统的非中心化游戏
  11. 压力应力测试软件,PODOMED(PODOMED) 足底应力测试分析系统-运动科学实验室
  12. 【嵌入式系统】STM32时钟系统+时钟配置函数解析
  13. 【Unscented Kalman Filter】C#无迹卡尔曼滤波Demo--两个示例附代码
  14. 这就是你日日夜夜想要的docker!!!---------Harbor私有仓库
  15. 递归计算 1 - 100 的和
  16. 人工智能技术对全民生活的影响
  17. 史上讲解最好的 Docker 教程,从入门到精通(建议收藏的教程)
  18. 中心极限与大数定理律的关系_CLT 中心极限定理
  19. php nslookup,nslookup - 运维猫的个人空间 - OSCHINA - 中文开源技术交流社区
  20. 最伟大的程序员Richard Stallman主页

热门文章

  1. C++Persistent segment tree持久段树的实现算法(附完整源码)
  2. C语言递归算法将十进制转换为二进制(附完整源码)
  3. html分页首页上一页下一页,HTML静态分页(形如:首页,上一页,下一页,尾页)...
  4. jdbc mysql 报错 ssl_Mybatis使用JDBC连接数据库报错及解决方案
  5. 我理解的HBSE应用场景(交流篇)
  6. 在tnsnames.ora中配置监听
  7. inverse和Cascade详解
  8. 表的插入、更新、删除、合并操作_20_通过表关联删除多张表
  9. 【tensorflow】tf.reshape函数说明:重塑张量
  10. html文件最后一行文字,文本多行溢出显示...之最后一行不到行尾的解决