jQuery+css last-child实现选择最后一个子元素操作示例


Posted in jQuery onDecember 10, 2018

本文实例讲述了jQuery+css last-child实现选择最后一个子元素操作。分享给大家供大家参考,具体如下:

<!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;}
</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:last').addClass("red"); //$('div p:last') 选择 最后一个P元素 并高亮显示得出结果如下:
$('div p:last-child').addClass("red");//$('div p:last-child') 将选择所有位于div最后一个p子元素,并高亮:
});
</script>
<div>
<p>Paragraph</p>
<p>Paragraph</p>
<p>Paragraph</p>
</div>
<div>
<p>Paragraph</p>
<p>Paragraph</p>
<p>Paragraph</p>
</div>
<div>
<p>Paragraph</p>
<p>Paragraph</p>
<p>Paragraph<span>sssssssssss</span></p>
</div>
</body>
</html>

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

jQuery+css last-child实现选择最后一个子元素操作示例

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

jQuery 相关文章推荐
jQuery插件ImgAreaSelect实现头像上传预览和裁剪功能实例讲解一
May 26 jQuery
jQuery+Ajax实现用户名重名实时检测
Jun 01 jQuery
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
jQuery 控制文本框自动缩小字体填充
Jun 16 jQuery
jQuery:unbind方法的使用详解
Aug 14 jQuery
jQuery DOM节点的遍历方法小结
Aug 15 jQuery
使用jQuery动态设置单选框的选中效果
Dec 06 jQuery
jQuery添加新内容的四个常用方法分析【append,prepend,after,before】
Mar 19 jQuery
使用jQuery mobile NuGet让你的网站在移动设备上同样精彩
Jun 18 jQuery
jquery.tagsinput.js实现记录checkbox勾选的顺序
Sep 21 jQuery
jquery更改元素属性attr()方法操作示例
May 22 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
使用jquery模拟a标签的click事件无法实现跳转的解决
Dec 04 #jQuery
You might like
php 无限极分类
2008/03/27 PHP
PHP中“简单工厂模式”实例代码讲解
2012/09/04 PHP
深入理解用mysql_fetch_row()以数组的形式返回查询结果
2013/06/05 PHP
解决cPanel无法安装php5.2.17
2014/06/22 PHP
Linux下PHP安装mcrypt扩展模块笔记
2014/09/10 PHP
PHP使用Mysqli类库实现完美分页效果的方法
2016/04/07 PHP
JavaScript DOM 学习第九章 选取范围的介绍
2010/02/19 Javascript
人人网javascript面试题 可以提前实现下
2012/01/05 Javascript
js 浏览本地文件夹系统示例代码
2013/10/24 Javascript
一个支持任意尺寸的图片上下左右滑动效果
2014/08/24 Javascript
JQuery实现简单的服务器轮询效果实例
2016/03/31 Javascript
Immutable 在 JavaScript 中的应用
2016/05/02 Javascript
jQuery实现节点的追加、替换、删除、复制功能示例
2017/07/11 jQuery
vue.js轮播图组件使用方法详解
2018/07/03 Javascript
详解在vue-test-utils中mock全局对象
2018/11/07 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
2019/04/08 Javascript
微信小程序实用代码段(收藏版)
2019/12/17 Javascript
JS实现水平移动与垂直移动动画
2019/12/19 Javascript
python批量替换页眉页脚实例代码
2018/01/22 Python
Python实现读写INI配置文件的方法示例
2018/06/09 Python
Python文件如何引入?详解引入Python文件步骤
2018/12/10 Python
python 获取等间隔的数组实例
2019/07/04 Python
Pandas 缺失数据处理的实现
2019/11/04 Python
使用python实现画AR模型时序图
2019/11/20 Python
python实现两个一维列表合并成一个二维列表
2019/12/02 Python
Django基于客户端下载文件实现方法
2020/04/21 Python
解决python和pycharm安装gmpy2 出现ERROR的问题
2020/08/28 Python
洲际酒店集团美国官网:IHG美国
2017/11/16 全球购物
马德里运动鞋商店:Nigra Mercato
2020/02/16 全球购物
Loreto Gallo英国:欧洲领先的在线药房
2021/01/21 全球购物
SQL Server面试题
2013/04/04 面试题
合作意向书模板
2014/03/31 职场文书
学校安全管理制度
2015/08/06 职场文书
小学教师暑期培训心得体会
2016/01/09 职场文书
Pygame如何使用精灵和碰撞检测
2021/11/17 Python
SpringBoot整合minio快速入门教程(代码示例)
2022/04/03 Java/Android