jQuery中:last选择器用法实例


Posted in Javascript onDecember 30, 2014

本文实例讲述了jQuery中:last选择器用法。分享给大家供大家参考。具体分析如下:

此选择器匹配元素集合中的最后一个元素。

语法结构:

$(":last")

此选择器一般和其他的选择器配合使用,比如类选择器和元素选择器等等。例如:
$("li:last").css("color","green")

以上代码能够将li元素集合中的最后一个li元素中的字体颜色设置为绿色。
如果不和其他选择器配合使用,则默认状态是和*选择器配合使用,例如$(":last")等同于$("*:last")。

实例代码:

实例一:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title> 

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $("li:last").css("color","green") 

  }) 

}) 

</script> 

</head> 

<body> 

<div> 

  <ul> 

    <li class="zhuanqu">html专区</li> 

    <li class="zhuanqu">div+css专区</li> 

    <li class="zhuanqu">jQuery专区</li> 

    <li class="zhuanqu">Javascript专区</li> 

  </ul> 

</div> 

<button>点击查看效果</button> 

</body> 

</html>[/size]

[size=2]

以上代码代码可以将li元素集合中最后一个li元素中的字体颜色设置为绿色。

实例二:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

<meta name="author" content="https://3water.com/" /> 

<title>三水点靠木</title> 

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 

<script type="text/javascript"> 

$(document).ready(function(){ 

  $("button").click(function(){ 

    $(":last").css("color","green") 

  }) 

}) 

</script> 

</head> 

<body> 

<div> 

  <ul> 

    <li class="zhuanqu">html专区</li> 

    <li class="zhuanqu">div+css专区</li> 

    <li class="zhuanqu">jQuery专区</li> 

    <li class="zhuanqu">Javascript专区</li> 

  </ul> 

  <div> 

     <span>三水点靠木</span> 

  </div> 

</div> 

<button>点击查看效果</button> 

</body> 

</html>

由于没有指定选择器与:last选择器匹配使用,所以将会默认与*选择器匹配使用,所以将会让button按钮中的字体颜色设置为绿色。

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

Javascript 相关文章推荐
jQuery 常见开发使用技巧总结
Dec 26 Javascript
jQuery ctrl+Enter shift+Enter实现代码
Feb 07 Javascript
浅谈javascript的数据类型检测
Jul 10 Javascript
JQuery在页面中添加和除移DOM示例代码
Jun 24 Javascript
JavaScript函数模式详解
Nov 07 Javascript
JS操作HTML自定义属性的方法
Feb 10 Javascript
完美解决jQuery符号$与其他javascript 库、框架冲突的问题
Aug 09 Javascript
Bootstrap基本组件学习笔记之进度条(15)
Dec 08 Javascript
十大热门的JavaScript框架和库
Mar 21 Javascript
jQuery Ajax 实现分页 kkpager插件实例代码
Aug 10 jQuery
从理论角度讨论JavaScript闭包
Apr 03 Javascript
javascript的惯性运动实现代码实例
Sep 07 Javascript
JavaScript中对象property的删除方法介绍
Dec 30 #Javascript
JavaScript中检查对象property的存在性方法介绍
Dec 30 #Javascript
JavaScript中遍历对象的property的3种方法介绍
Dec 30 #Javascript
JavaScript语言对Unicode字符集的支持详解
Dec 30 #Javascript
JavaScript中的对象的extensible属性介绍
Dec 30 #Javascript
JavaScript中的对象序列化介绍
Dec 30 #Javascript
JavaScript中的数组特性介绍
Dec 30 #Javascript
You might like
实例讲解PHP面向对象之多态
2014/08/20 PHP
CodeIgniter多语言实现方法详解
2016/01/20 PHP
JavaScript关于select的相关操作说明
2010/01/13 Javascript
基于JQuery的动态删除Table表格的行和列的代码
2011/05/12 Javascript
js自执行函数的几种不同写法的比较
2012/08/16 Javascript
Jquery写一个鼠标拖动效果实现原理与代码
2012/12/24 Javascript
javascript trim函数在IE下不能用的解决方法
2014/09/12 Javascript
node.js中的fs.statSync方法使用说明
2014/12/16 Javascript
jquery实现点击label的同时触发文本框点击事件的方法
2015/06/05 Javascript
介绍一个简单的JavaScript类框架
2015/06/24 Javascript
使用微信内置浏览器点击下拉框出现页面乱跳转现象(iphone),该怎么办
2016/01/04 Javascript
JavaScript中Object.prototype.toString方法的原理
2016/02/24 Javascript
jQuery使用Layer弹出层插件闪退问题
2016/12/22 Javascript
bootstrap的工具提示实例代码
2017/05/17 Javascript
微信小程序自定义prompt组件步骤详解
2018/06/12 Javascript
angularjs下ng-repeat点击元素改变样式的实现方法
2018/09/12 Javascript
AngularJS上传文件的示例代码
2018/11/10 Javascript
如何在微信小程序里面退出小程序的方法
2019/04/28 Javascript
微信小程序地图导航功能实现完整源代码附效果图(推荐)
2019/04/28 Javascript
[01:46]TI4西雅图DOTA2前线报道 中国选手抱团调时差
2014/07/08 DOTA
[04:54]DOTA2 2017国际邀请赛:上届冠军WINGS采访短片
2017/08/09 DOTA
Django Admin实现上传图片校验功能
2016/03/06 Python
python调用xlsxwriter创建xlsx的方法
2018/05/03 Python
基于pycharm导入模块显示不存在的解决方法
2018/10/13 Python
numpy数组做图片拼接的实现(concatenate、vstack、hstack)
2019/11/08 Python
使用Puppeteer爬取微信文章的实现
2020/02/11 Python
Tensorflow加载Vgg预训练模型操作
2020/05/26 Python
python解决OpenCV在读取显示图片的时候闪退的问题
2021/02/23 Python
HTML5在微信内置浏览器下右上角菜单的调整字体导致页面显示错乱的问题
2021/01/19 HTML / CSS
澳大利亚最大的女装零售商:Millers
2017/09/10 全球购物
中专生自我鉴定
2013/12/17 职场文书
优秀毕业生自我鉴定
2014/01/19 职场文书
田径运动会通讯稿
2014/09/13 职场文书
2015年党员公开承诺事项
2015/04/27 职场文书
2015年小学一年级班主任工作总结
2015/05/21 职场文书
欢送领导祝酒词
2015/08/12 职场文书