jQuery中end()方法用法实例


Posted in Javascript onJanuary 08, 2015

本文实例讲述了jQuery中end()方法用法。分享给大家供大家参考。具体分析如下:

end()方法能够回到最近的一个"破坏性"操作之前,即将匹配的元素列表变为前一次的状态。
如果没有破坏性操作将返回一个空集。
破坏性操作的概念:指任何改变所匹配元素的操作。
可能大家对这个概念比较模糊,举个例子:

$("li").css("color","red");

以上代码的CSS函数就不是一个破坏性操作,因为匹配元素列表并没有发生变化,改变的是元素中的文本内容的CSS属性。
$("li").find(".first")

以上代码就是一个破坏性操作,因为匹配元素的列表发生了变化,比如有三个li元素,那么匹配元素的列表有三个元素,但是经过使用find()方法筛选以后,匹配元素列表只有一个元素了,这就是发生了"破坏性"操作。

语法结构:

$(selector).end()

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; 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(){ 

  $(".first").find(".div").css("color","green"); 

  $(".second").find(".div").end().css("color","blue"); 

  $(".third").find(".js").css("color","blue").end().css("color","red") 

}) 

</script>

</head>

<body>

<div>

  <ul class="first">

    <li>HTML专区</li>

    <li>Javascript专区</li>

    <li class="div">Div+Css专区</li>

    <li>Jquery专区</li>

  </ul>

  <ul class="second">

    <li>HTML专区</li>

    <li>Javascript专区</li>

    <li class="div">Div+Css专区</li>

    <li>Jquery专区</li>

  </ul>

  <ul class="third">

    <li>HTML专区</li>

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

    <li>Div+Css专区</li>

    <li>Jquery专区</li>

  </ul>

</div>

</body>

</html>

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

Javascript 相关文章推荐
一个用js实现的页内搜索代码
May 23 Javascript
JS 控制非法字符的输入代码
Dec 04 Javascript
基于JQuery的日期联动实现代码
Feb 24 Javascript
用javascript作一个通用向导说明
Aug 30 Javascript
jquery实现submit提交表单
Feb 03 Javascript
AngularJS基础 ng-srcset 指令简单示例
Aug 03 Javascript
jQuery如何解决IE输入框不能输入的问题
Oct 08 Javascript
使用JS实现图片轮播的实例(前后首尾相接)
Sep 21 Javascript
使用DataTable插件实现异步加载数据
Nov 19 Javascript
axios取消请求的实践记录分享
Sep 26 Javascript
JS实现textarea通过换行或者回车把多行数字分割成数组并且去掉数组中空的值
Oct 29 Javascript
Vue从TodoList中学父子组件通信
Feb 05 Javascript
jQuery中contents()方法用法实例
Jan 08 #Javascript
jQuery中andSelf()方法用法实例
Jan 08 #Javascript
jQuery中add()方法用法实例
Jan 08 #Javascript
javascript 动态创建表格
Jan 08 #Javascript
javascript实现避免页面按钮重复提交
Jan 08 #Javascript
Node.js 制作实时多人游戏框架
Jan 08 #Javascript
jQuery之DOM对象和jQuery对象的转换与区别分析
Jan 08 #Javascript
You might like
《星际争霸》各版本雷兽特点图文解析 雷兽不同形态一览
2020/03/02 星际争霸
使用symfony命令创建项目的方法
2016/03/17 PHP
详解PHP中array_rand函数的使用方法
2016/09/11 PHP
php-msf源码详解
2017/12/25 PHP
AeroWindow 基于JQuery的弹出窗口插件
2011/06/27 Javascript
JS中使用Array函数shift和pop创建可忽略参数的例子
2014/05/28 Javascript
jQuery读取XML文件内容的方法
2015/03/09 Javascript
JavaScript实现在标题栏上显示当前日期的方法
2015/03/19 Javascript
分离与继承的思想实现图片上传后的预览功能:ImageUploadView
2016/04/07 Javascript
AngularJS 所有版本下载地址
2016/09/14 Javascript
微信公众号开发 自定义菜单跳转页面并获取用户信息实例详解
2016/12/08 Javascript
Jqprint实现页面打印
2017/01/06 Javascript
微信小程序城市定位的实现实例(获取当前所在国家城市信息)
2017/05/17 Javascript
Vue2 使用 Echarts 创建图表实例代码
2017/05/18 Javascript
JavaScript实现的贝塞尔曲线算法简单示例
2018/01/30 Javascript
js实现3D照片墙效果
2019/10/28 Javascript
用实例详解Python中的Django框架中prefetch_related()函数对数据库查询的优化
2015/04/01 Python
在Python的gevent框架下执行异步的Solr查询的教程
2015/04/16 Python
详解Python读取配置文件模块ConfigParser
2017/05/11 Python
详解使用python的logging模块在stdout输出的两种方法
2017/05/17 Python
python计算两个地址之间的距离方法
2018/06/09 Python
mac下给python3安装requests库和scrapy库的实例
2018/06/13 Python
python实现控制台打印的方法
2019/01/12 Python
在Python中调用Ping命令,批量IP的方法
2019/01/26 Python
python实时检测键盘输入函数的示例
2019/07/17 Python
Python实现剪刀石头布小游戏(与电脑对战)
2019/12/31 Python
Python使用windows设置定时执行脚本
2020/11/12 Python
static全局变量与普通的全局变量有什么区别
2014/05/27 面试题
《只有一个地球》教学反思
2014/02/14 职场文书
微笑服务演讲稿
2014/05/13 职场文书
党的群众路线教育实践活动党员个人剖析材料
2014/10/08 职场文书
房屋租赁合同解除协议书
2014/10/11 职场文书
营业员岗位职责范本
2015/04/14 职场文书
2019学子的答谢词范本!
2019/07/05 职场文书
threejs太阳光与阴影效果实例代码
2022/04/05 Javascript
mysql 8.0.27 绿色解压版安装教程及配置方法
2022/04/20 MySQL