closest(expr|object|element)

概述

jQuery 1.3新增。从元素本身开始,逐级向上级元素匹配,并返回最先匹配的元素。。大理石平台生产厂

closest会首先检查当前元素是否匹配,如果匹配则直接返回元素本身。如果不匹配则向上查找父元素,一层一层往上,直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。

closest和parents的主要区别是:1,前者从当前元素开始匹配寻找,后者从父元素开始匹配寻找;2,前者逐级向上查找,直到发现匹配的元素后就停止了,后者一直向上查找直到根元素,然后把这些元素放进一个临时集合中,再用给定的选择器表达式去过滤;3,前者返回0或1个元素,后者可能包含0个,1个,或者多个元素。

closest对于处理事件委托非常有用。

.closest( selectors [, context ] )方法从 jQuery 1.7 开始,不再建议使用该方法,但是 jQuery 1.7 之前仍然可以使用。该方法将主要用于 jQuery 内部或插件作者使用。

参数

exprString,ArrayV1.3

用以过滤元素的表达式。jQuery 1.4开始,也可以传递一个字符串数组,用于查找多个元素。

expr,[context]StringV1.4

expr:用以过滤子元素的表达式

context:DOM元素在其中一个匹配的元素可以被发现。如果没有上下文在当时的情况下通过了jQuery设置将被使用。

jQuery object objectV1.6

一个用于匹配元素的jQuery对象

elementDOMElementV1.6

一个用于匹配元素的DOM元素。

示例

描述:

展示如何使用closest查找多个元素

HTML 代码:
<ul><li></li><li></li></ul>
jQuery 代码:
$("li:first").closest(["ul", "body"]);
结果:
[ul, body]

描述:

展示如何使用closest来完成事件委托。

HTML 代码:
<ul>
<li><b>Click me!</b></li>
<li>You can also <b>Click me!</b></li>
</ul>
jQuery 代码:
$(document).bind("click", function (e) {
$(e.target).closest("li").toggleClass("hilight");
});

closest(expr|object|element)的更多相关文章

  1. jQuery 3.1 API中文文档

    jQuery 3.1 API中文文档 一.核心 1.1 核心函数 jQuery([selector,[context]]) 接收一个包含 CSS 选择器的字符串,然后用这个字符串去匹配一组元素. jQ ...

  2. jQuery慢慢啃筛选(四)

    1.eq(index|-index) 获取第N个元素 其中负数:一个整数,指示元素的位置,从集合中的最后一个元素开始倒数.(1算起) $("p").eq(1)//获取匹配的第二个元 ...

  3. jQuery的选择器总结

    jQuery的选择器 不会返回undefined或null 基本选择器 id选择器:$('#id') element选择器:$('elem') class选择器:$('.class') 通配符选择器: ...

  4. jQuery的核心功能选择器

    选择器是jquery的核心 jquery选择器返回的对象是jquery对象,不会返回undefined或者null,因此不必进行判断 基本选择器: ID选择器  $("#ID") ...

  5. Java ArrayList add(int index, E element) example

    Simple add() method is used for adding an element at the end of the list however there is another va ...

  6. 各浏览器下使用 OBJECT 元素和 EMBED 元素嵌入 Flash 存在差异

    标准参考 OBJECT 元素定义了一个嵌入的对象.其引入的初衷是取代 IMG 和 APPLET 元素.不过由于安全等各方面原因以及缺乏浏览器支持,这一初衷并未实现.浏览器的对象支持依赖于对象类型.然而 ...

  7. 你知道Object中有哪些方法及其作用吗?

    一.引言二.Object方法详解1.1.registerNatives()1.2.getClass()1.2.1.反射三种方式:1.3.hashCode()1.4.equals()1.4.clone( ...

  8. Object中有哪些方法及其作用

    你知道Object中有哪些方法及其作用吗? 一.引言 二.Object方法详解 1.1.registerNatives() 1.2.getClass() 1.2.1.反射三种方式: 1.3.hashC ...

  9. JAVA中Object类方法详解

    一.引言 Object是java所有类的基类,是整个类继承结构的顶端,也是最抽象的一个类.大家天天都在使用toString().equals().hashCode().waite().notify() ...

随机推荐

  1. TCP连接可能出现的异常总结

    1.java.net.BindException:Address already in use:bind 服务端出错,两次对同一个端口进行启动(会在服务端发生报错,抛出异常,不考虑) 2.java.n ...

  2. 文件锁-fcntl flock lockf

    这三个函数的作用都是给文件加锁,那它们有什么区别呢? 首先flock和fcntl是系统调用,而lockf是库函数.lockf实际上是fcntl的封装,所以lockf和fcntl的底层实现是一样的,对文 ...

  3. Thinking In Java 4th Chap5 初始化和清理

    类的构造器名必须与类名一致,且无返回类型,通过参数类型的不同(即使顺序不同也行)可以重载构造器,也可以以此技巧重载方法 this关键字:表示对“调用方法的那个对象的引用”,也可将当前对象传递给其他方法 ...

  4. NOIP(CSP)答题技巧&小细节

    1.主函数类型 通常使用int main(),然而可以使用完全等价的signed main() 解锁 #define int long long  的操作 2.long long 的使用 数列长度/边 ...

  5. Docker 常用命令和Dockerfile

    Docker 简介 官方的解释为:Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的镜像中,然后发布到任何流行的 Linux或Windows 机器上,也可以实现 ...

  6. 3.解决git不可用问题

    升级gityum -y update git   配置阿里云yum源yum -y update nssyum -y update nss curl libcurl

  7. spring——aop详细总结1

    AOP(Aspect-Oriented Programming, 面向切面编程): 是一种新的方法论, 是对传统 OOP(Object-Oriented Programming, 面向对象编程) 的补 ...

  8. SQLSERVER 在PROCEDURE 中动态执行SQL语句【EXEC】并获取

    1.直接上代码 CREATE PROCEDURE [dbo].[TEST] AS BEGIN DECLARE )='N8-4F', --構建SQL需要的條件 ),--構建後的SQL語句 @cnt in ...

  9. ADO连接达梦7数据库,利用OLEDB建立连接

    达梦数据库本身提供多种驱动如JDBC ODBC OLEDB等等 在安装的时候可以进行勾选. 如果不安装数据库的驱动无法与达梦数据库建立连接. 达梦数据库在数据库构成或结构上与oracle极为相似,而且 ...

  10. arcgis js之点击获取featureLayer中的点

    arcgis js之点击获取featureLayer中的点 代码: this.view.on('click', (evt) => { let layer = this.map.findLayer ...