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和ajax代替iframe的方法(详解)
Apr 12 jQuery
jQuery鼠标悬停内容动画切换效果
Apr 27 jQuery
jquery+css实现简单的图片轮播效果
Aug 07 jQuery
基于JQuery的Ajax方法使用详解
Aug 16 jQuery
jQuery中extend函数简单用法示例
Oct 11 jQuery
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
基于jQuery.i18n实现web前端的国际化
May 04 jQuery
JQuery模拟实现网页中自定义鼠标右键菜单功能
Nov 14 jQuery
jQuery插件simplePagination的使用方法示例
Apr 28 jQuery
jQuery 实现扁平式小清新导航
Jul 07 jQuery
jQuery实现简单轮播图效果
Dec 27 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下删除字符串中HTML标签的函数
2008/08/27 PHP
Php 构造函数construct的前下划线是双的_
2009/12/08 PHP
PHP CodeBase:将时间显示为&quot;刚刚&quot;&quot;n分钟/小时前&quot;的方法详解
2013/06/06 PHP
PHP curl实现抓取302跳转后页面的示例
2014/07/04 PHP
PHP实现仿Google分页效果的分页函数
2015/07/29 PHP
php设计模式之迭代器模式实例分析【星际争霸游戏案例】
2020/04/07 PHP
js 弹出菜单/窗口效果
2011/10/30 Javascript
指定区域的图片自动按比例缩小的js代码(防止页面被图片撑破)
2014/02/21 Javascript
jQuery中[attribute*=value]选择器用法实例
2014/12/31 Javascript
Javascript实现单例模式
2016/01/24 Javascript
jquery移除了live()、die(),新版事件绑定on()、off()的方法
2016/10/26 Javascript
微信小程序 同步请求授权的详解
2017/08/04 Javascript
JavaScript基于面向对象实现的猜拳游戏
2018/01/03 Javascript
详解angular脏检查原理及伪代码实现
2018/06/08 Javascript
vue-cli初始化项目中使用less的方法
2018/08/09 Javascript
[04:39]显微镜下的DOTA2第十三期—Pis卡尔个人秀
2014/04/04 DOTA
[01:07:21]NAVI vs VG Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
Python利用IPython提高开发效率
2016/08/10 Python
Python向日志输出中添加上下文信息
2017/05/24 Python
python3操作mysql数据库的方法
2017/06/23 Python
python 实现求解字符串集的最长公共前缀方法
2018/07/20 Python
Python延时操作实现方法示例
2018/08/14 Python
python基于C/S模式实现聊天室功能
2019/01/09 Python
pytorch 可视化feature map的示例代码
2019/08/20 Python
pytorch实现保证每次运行使用的随机数都相同
2020/02/20 Python
解决python对齐错误的方法
2020/07/16 Python
记一次python 爬虫爬取深圳租房信息的过程及遇到的问题
2020/11/24 Python
如何利用Python matplotlib绘制雷达图
2020/12/21 Python
李维斯法国官网:Levi’s法国
2019/07/13 全球购物
护士自我鉴定
2013/10/23 职场文书
事假请假条范文
2014/04/11 职场文书
酒店员工培训方案
2014/06/02 职场文书
小学课外阅读总结
2014/07/09 职场文书
检讨书范文1000字
2015/01/28 职场文书
2015年社区科普工作总结
2015/05/13 职场文书
运动会100米加油稿
2015/07/21 职场文书