jQuery的end()方法使用详解


Posted in Javascript onJuly 15, 2015

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" />
<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>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
使用onbeforeunload属性后的副作用
Mar 08 Javascript
return false;和e.preventDefault();的区别
Jul 11 Javascript
jquery获取元素值的方法(常见的表单元素)
Nov 15 Javascript
获取3个数组不重复的值的具体实现
Dec 30 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
Aug 26 Javascript
JavaScript操作HTML DOM节点的基础教程
Mar 11 Javascript
通用无限极下拉菜单的实现代码
May 31 Javascript
jQuery实现移动端Tab选项卡效果
Mar 15 Javascript
AngularJS获取json数据的方法详解
May 27 Javascript
js canvas实现红包照片效果
Aug 21 Javascript
解决layui数据表格排序图标被超出的表头挤出去的问题
Sep 19 Javascript
layer.open组件获取弹出层页面变量、函数的实例
Sep 25 Javascript
浅谈$(document)和$(window)的区别
Jul 15 #Javascript
浅谈window对象的scrollBy()方法
Jul 15 #Javascript
jQuery的bind()方法使用详解
Jul 15 #Javascript
纯JavaScript实现的分页插件实例
Jul 14 #Javascript
javascript实现网页字符定位的方法
Jul 14 #Javascript
JavaScript取得WEB安全颜色列表的方法
Jul 14 #Javascript
jquery获得当前html页面源码的方法
Jul 14 #Javascript
You might like
咖啡豆的最常见发酵处理方法,详细了解一下
2021/03/03 冲泡冲煮
php下安装配置fckeditor编辑器的方法
2011/03/02 PHP
php中header设置常见文件类型的content-type
2015/06/23 PHP
PHP简单实现遍历目录下特定文件的方法小结
2017/05/22 PHP
Laravel框架中自定义模板指令总结
2017/12/17 PHP
PHP使用标准库spl实现的观察者模式示例
2018/08/04 PHP
浅谈PHP无限极分类原理
2019/03/14 PHP
tp5.1 实现setInc字段自动加1
2019/10/18 PHP
javascript中获取选中对象的类型
2007/04/02 Javascript
麻雀虽小五脏俱全 Dojo自定义控件应用
2010/09/04 Javascript
jquery常用操作小结
2014/07/21 Javascript
JavaScript判断字符长度、数字、Email、电话等常用判断函数分享
2015/04/01 Javascript
JQuery球队选择实例
2015/05/18 Javascript
JavaScript去除数组里重复值的方法
2015/07/13 Javascript
jQuery多级手风琴菜单实例讲解
2015/10/22 Javascript
Javascript对象字面量的理解
2016/06/22 Javascript
教你用Cordova打包Vue项目的方法
2017/10/17 Javascript
nodejs超出最大的调用栈错误问题
2017/12/27 NodeJs
使用异步controller与jQuery实现卷帘式分页
2019/06/18 jQuery
js中的this的指向问题详解
2019/08/29 Javascript
解决vue自定义全局消息框组件问题
2019/11/22 Javascript
python开发之for循环操作实例详解
2015/11/12 Python
一个基于flask的web应用诞生(1)
2017/04/11 Python
Python编程图形库之Pillow使用方法讲解
2018/12/28 Python
python开发之anaconda以及win7下安装gensim的方法
2019/07/05 Python
解决Python3用PIL的ImageFont输出中文乱码的问题
2019/08/22 Python
详解Django中的FBV和CBV对比分析
2021/03/01 Python
美国时尚孕妇装品牌:A Pea in the Pod
2017/07/16 全球购物
应用数学自荐书范文
2013/11/24 职场文书
保密工作实施方案
2014/02/24 职场文书
司机职责范本
2014/03/08 职场文书
实践单位评语
2014/04/26 职场文书
大学生考试作弊检讨书
2014/09/21 职场文书
小学感恩节活动策划方案
2014/10/06 职场文书
小浪底导游词
2015/02/12 职场文书
父亲节活动总结
2015/02/12 职场文书