jQuery选择器选中最后一个元素,倒数第二个元素操作示例


Posted in jQuery onDecember 10, 2018

本文实例讲述了jQuery选择器选中最后一个元素,倒数第二个元素操作。分享给大家供大家参考,具体如下:

HTML部分:

<div>
  <p>元素1</p>
  <p>元素2</p>
  <p>元素3</p>
  <p>元素4</p>
  <p>元素5</p>
</div>

取倒数第二个p元素

$("div p").eq(-2)

取最后一个p元素

$("div p").last()

完整测试示例代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3water.com jQuery选择器</title>
<style>
.red{color:#FF0000;}
.blue{color:#0000FF;}
</style>
</head>
<body>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("div p").eq(-2).addClass('red');//倒数第二个p元素
$("div p").last().addClass('blue');//最后一个p元素
});
</script>
<div>
  <p>元素1</p>
  <p>元素2</p>
  <p>元素3</p>
  <p>元素4</p>
  <p>元素5</p>
</div>
</body>
</html>

这里使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试,可得到如下运行效果:

jQuery选择器选中最后一个元素,倒数第二个元素操作示例

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery导航条固定定位效果实例代码
May 26 jQuery
jQuery回调方法使用示例
Jun 26 jQuery
基于Jquery Ajax type的4种类型(详解)
Aug 02 jQuery
jQuery选择器之子元素过滤选择器
Sep 28 jQuery
jQuery Datatables表头不对齐的解决办法
Nov 27 jQuery
jQuery基于闭包实现的显示与隐藏div功能示例
Jun 09 jQuery
利用jquery和BootStrap实现动态滚动条效果
Dec 03 jQuery
详解JavaScript原生封装ajax请求和Jquery中的ajax请求
Feb 14 jQuery
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 jQuery
jQuery实现动态加载(按需加载)javascript文件的方法分析
May 31 jQuery
高效jQuery选择器的5个技巧实例分析
Nov 26 jQuery
如何在vue 中引入使用jquery
Nov 10 jQuery
jQuery+css last-child实现选择最后一个子元素操作示例
Dec 10 #jQuery
JQuery Ajax执行跨域请求数据的解决方案
Dec 10 #jQuery
jQuery时间戳和日期相互转换操作示例
Dec 07 #jQuery
超好用的jQuery分页插件jpaginate用法示例【附源码下载】
Dec 06 #jQuery
jQuery动态操作表单示例【基于table表格】
Dec 06 #jQuery
使用jQuery动态设置单选框的选中效果
Dec 06 #jQuery
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 #jQuery
You might like
php-fpm重启导致的程序执行中断问题详解
2019/04/29 PHP
关于php开启错误提示的总结
2019/09/24 PHP
laravel 模型查询按照whereIn排序的示例
2019/10/16 PHP
input、button的不同type值在ajax提交表单时导致的陷阱
2009/02/24 Javascript
关于jQuery参考实例2.0 用jQuery选择元素
2013/04/07 Javascript
div拖拽插件——JQ.MoveBox.js(自制JQ插件)
2013/05/17 Javascript
IE、FF浏览器下修改标签透明度
2014/01/28 Javascript
Ext4.2的Ext.grid.plugin.RowExpander无法触发事件解决办法
2014/08/15 Javascript
纯JS实现本地图片预览的方法
2015/07/31 Javascript
jQuery Ajax和getJSON获取后台普通json数据和层级json数据用法分析
2016/06/08 Javascript
JavaScript仿微信打飞机游戏
2020/07/05 Javascript
VUE前端cookie简单操作
2017/10/17 Javascript
使用JS获取SessionStorage的值
2018/01/12 Javascript
react router4+redux实现路由权限控制的方法
2018/05/03 Javascript
React 组件间的通信示例
2018/06/14 Javascript
微信小程序自定义对话框弹出和隐藏动画
2018/07/19 Javascript
vue 弹框产生的滚动穿透问题的解决
2018/09/21 Javascript
JavaScript实现联动菜单特效
2020/01/07 Javascript
vue 使用饿了么UI仿写teambition的筛选功能
2021/03/01 Vue.js
把大数据数字口语化(python与js)两种实现
2013/02/21 Python
python基础教程之常用运算符
2014/08/29 Python
python获取远程图片大小和尺寸的方法
2015/03/26 Python
Python3.4 splinter(模拟填写表单)使用方法
2018/10/13 Python
Python魔法方法详解
2019/02/13 Python
PyQt5响应回车事件的方法
2019/06/25 Python
Pandas时间序列重采样(resample)方法中closed、label的作用详解
2019/12/10 Python
Python坐标轴操作及设置代码实例
2020/06/04 Python
python代码实现猜拳小游戏
2020/11/30 Python
SQL Server 2000数据库的文件有哪些,分别进行描述。
2015/11/09 面试题
公司员工的自我评价范例
2013/11/01 职场文书
四群教育工作实施方案
2014/03/26 职场文书
民族团结演讲稿范文
2014/08/27 职场文书
春季运动会加油词
2015/07/18 职场文书
吧主申请感言怎么写
2015/08/03 职场文书
党员干部学习心得体会
2016/01/23 职场文书
python内置模块之上下文管理contextlib
2022/06/14 Python