使用closest替换parent
尽量不要使用parent去获取DOM元素,如下代码:
var $activeRows = $this.parent().parent().children(".active");
这样的代码扩展性不好,一旦DOM结构发生改变,这里的逻辑分分钟会挂,如某天你可能会套了个div用来清除浮动,但是没想到导致有个按钮点不了了就坑爹了。
应该用closest,如:
var $activeRows = $this.closest(".order-list").find(".active");
直接定位和目标元素的最近共同祖先节点,然后find一下目标元素就好了,这样就不会出现上面的问题,只要容器的类没有变。如果你需要处理非自己的相邻元素,可以这么搞:
$this.closest("li").siblings("li.active").removeClass("active");
$this.addClass("active");
使用closest替换parent的更多相关文章
- jq中的事件委托:closest,parent,parents,delegate
closest .closest(selector) 从当前元素开始沿 DOM 树向上,获得匹配第一个符合选择器的祖先元素,返回零个或一个元素的 jQuery 对象. .parents() 和 .cl ...
- 锋利的jQuery第2版学习笔记1~3章
第1章,认识jQuery 注意:使用的jQuery版本为1.7.1 目前流行的JavaScript库 Prototype(http://www.prototypejs.org),成型早,面向对象的思想 ...
- jquery 节点操作大全
$para.attr("title"); 实例: <script type="text/javascript"> //<![CDATA[ $( ...
- jQuery学习之旅 Item4 细说DOM操作
jQuery-–DOM操作(文档处理) Dom是Document Object Model的缩写,意思是文档对象模型.DOM是一种与浏览器.平台.语言无关的接口,使用该接口可以轻松访问页面中所有的标准 ...
- HTML/CSS/JS编码规范
最近整理了一份HTML/CSS/JS编码规范,供大家参考.目录:一.HTML编码规范二.CSS编码规范三.JS编码规范 一.HTML编码规范 1. img标签要写alt属性 根据W3C标准,img标签 ...
- 前端之JavaScript基础
前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...
- BOM和DOM
Day 01 正课: 1.什么是DOM: 2.DOM Tree 3.遍历DOM树: 1.什么是DOM: 原生js=ECMAScript(核心语法)+ DOM(专门操作网页内容的API)+ 3天 BOM ...
- 39、重新复习js之三
1.盒子模型典型标签 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http:// ...
- Jquery遍历选中的input标签
$("input[name='chkAgent']:[checked]").each(function () { alert($(this).attr("value&qu ...
随机推荐
- hdu1762 树的上的查询
2015-10-07 20:44:42 题意问的是给了一颗树,然后又1000000次查询u,v,问不在树路径上的点的编号最小值,以1为根 建这颗树,然后在同一棵子树中的点子让就输出1 否则我们记录每个 ...
- DeepLearning资源汇总
仍旧不完全统计,边学边加 Bagging与随机森林算法原理 分类数据集 MNIST Cifar10 ILSVRC排行榜 Cifar10 board train loss与test loss结果分析 ...
- python glob 模块
glob模块用来查找文件目录和文件,可以和常用的find功能进行类比.glob支持*?[]这三种通配符.返回的数据类型是list.常见的两个方法有glob.glob()和glob.iglob(),ig ...
- Hinton“深度学习之父”和“神经网络先驱”,新论文Capsule将推翻自己积累了30年的学术成果时
Hinton“深度学习之父”和“神经网络先驱”,新论文Capsule将推翻自己积累了30年的学术成果时 在论文中,Capsule被Hinton大神定义为这样一组神经元:其活动向量所表示的是特定实体类型 ...
- 典型 python 小练习
#格式化输出 3方式a=input('user:').strip()print('%s'%a) #%s 占位符a1=[1,2,3]print(f'333{a1}早') #法二print('ss{0}k ...
- Numpy 矩阵
矩阵定义在NumPy中,矩阵是ndarray的子类,可以由专用的字符串格式来创建 1. 创建矩阵mat函数创建矩阵(mat函数创建矩阵时,若输入已为matrix或ndarray对象,则不会为它们创建副 ...
- input file accept类型
Valid Accept Types: For CSV files (.csv), use: <input type="file" accept=".csv&quo ...
- 高级架构进阶之HashMap源码就该这么学
引言--面试常见的问题 问:“你用过HashMap,你能跟我说说它吗?” “当然用过,HashMap是一种<key,value>的存储结构,能够快速将key的数据put方式存储起来,然后很 ...
- CentOS7下部署Django项目详细操作步骤
严格按下面步骤 一.更新系统软件包 yum update -y 二.安装软件管理包和可能使用的依赖 yum -y groupinstall "Development tools" ...
- django rest framework跨表取值