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 Jsonp跨域模拟搜索引擎
Jun 17 jQuery
jQuery、layer实现弹出层的打开、关闭功能
Jun 28 jQuery
jQuery实现全选、反选和不选功能
Aug 16 jQuery
jQuery实现打开网页自动弹出遮罩层或点击弹出遮罩层功能示例
Oct 19 jQuery
jQuery实现动态控制页面元素的方法分析
Dec 20 jQuery
jQuery实现简单的Ajax调用功能示例
Feb 15 jQuery
JQuery样式操作、click事件以及索引值-选项卡应用示例
May 14 jQuery
Jquery属性的获取/设置及样式添加/删除操作技巧分析
Dec 23 jQuery
jquery添加div实现消息聊天框
Feb 08 jQuery
jQuery 函数实例分析【函数声明、函数表达式、匿名函数等】
May 19 jQuery
jquery实现抽奖功能
Oct 22 jQuery
html5以及jQuery实现本地图片上传前的预览代码实例讲解
Mar 01 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生成自定义长度随机字符串的函数分享
2014/05/04 PHP
PHP中shuffle数组值随便排序函数用法
2014/11/21 PHP
php使用scandir()函数扫描指定目录下所有文件示例
2019/06/08 PHP
laravel返回统一格式错误码问题
2019/11/04 PHP
thinkphp框架实现路由重定义简化url访问地址的方法分析
2020/04/04 PHP
JavaScript 使用技巧精萃(.net html
2009/04/25 Javascript
javascript下判断一个对象是否具有指定名称的属性的的代码
2010/01/11 Javascript
电子商务网站上的常用的js放大镜效果
2011/12/08 Javascript
JavaScript创建一个欢迎cookie弹出窗实现代码
2013/03/15 Javascript
JS操作Cookie写入和读取实例代码
2013/10/20 Javascript
全面解析Bootstrap表单使用方法(表单样式)
2015/11/24 Javascript
浅谈js中的三种继承方式及其优缺点
2016/08/10 Javascript
基于MVC5和Bootstrap的jQuery TreeView树形控件(二)之数据支持json字符串、list集合
2016/08/11 Javascript
微信小程序 生命周期详解
2016/10/12 Javascript
将Vue组件库更换为按需加载的方法步骤
2020/05/06 Javascript
使用 UniApp 实现小程序的微信登录功能
2020/06/09 Javascript
Vue实现小购物车功能
2020/12/21 Vue.js
[01:24:09]Ti4 冒泡赛第二轮DK vs C9 1
2014/07/14 DOTA
[00:32]2018DOTA2亚洲邀请赛Newbee出场
2018/04/03 DOTA
[00:56]跨越时空加入战场 全新祈求者身心“失落奇艺侍祭”展示
2019/07/20 DOTA
[20:39]DOTA2-DPC中国联赛 正赛开幕式 1月18日
2021/03/11 DOTA
Python3基础之条件与循环控制实例解析
2014/08/13 Python
Python实现的下载8000首儿歌的代码分享
2014/11/21 Python
Python 使用os.remove删除文件夹时报错的解决方法
2017/01/13 Python
Python如何实现邮件功能
2020/05/27 Python
一款利用html5和css3实现的3D滚动特效的教程
2015/01/04 HTML / CSS
5个你不知道的HTML5的接口介绍
2013/08/07 HTML / CSS
AmazeUI中模态框的实现
2020/08/19 HTML / CSS
美国顶级品牌男士大码服装店:DXL
2017/08/30 全球购物
美国专业汽车音响和移动电子产品零售商:Car Toys
2019/05/13 全球购物
skyn ICELAND官网:冰岛成分天然护肤品
2020/08/24 全球购物
学雷锋活动倡议书
2014/08/30 职场文书
货款欠条范本
2015/07/03 职场文书
详解Go与PHP的语法对比
2021/05/29 PHP
Java生成读取条形码和二维码的简单示例
2021/07/09 Java/Android
Linux在两个服务器直接传文件的操作方法
2022/08/05 Servers