元素接口的closest()方法用于遍历HTML文档树中的元素及其父元素,直到找到与提供的选择器字符串匹配的第一个节点。

用法:

targetElement.closest( selectors )

参数:此方法接受如上所述和以下描述的单个参数:

selectors:它是一个字符串,它指定将用于查找节点的HTML选择器。

返回值:如果找到匹配的祖先,则此方法返回最接近的元素;否则,如果找不到此类元素,则返回null。

例:下面的示例通过在HTML DOM结构中搜索给定的元素来显示closest()方法的用法。

HTML

GeeksforGeeks

Hello! it is a span

It is paragraph

// Get the paragraph element

var element = document.getElementById('p');

// Return the closest paragraph element

// which is the element itself

var close1 = element.closest("p");

console.log(close1)

// Return the closest span element

var close2 = element.closest("span");

console.log(close2)

// Return the closest div element

var close3 = element.closest("div");

console.log(close3)

输出:

返回最接近选择器的元素。

支持的浏览器:下面列出了DOM closest()方法支持的浏览器:

谷歌浏览器

Edge

Firefox

苹果Safari

Opera

html等待,休眠代码,HTML DOM closest()用法及代码示例相关推荐

  1. html焦点试图代码,HTML DOM focus()用法及代码示例

    DOM focus()方法用于为元素赋予焦点,并借助blur()方法删除焦点.我们可以将焦点放在任何元素上,并通过执行一些操作来启用它.例如,我们可以通过单击按钮将焦点放在某些文本上. 用法: Obj ...

  2. html dom的nodetype值介绍,HTML DOM nodeType用法及代码示例

    DOM nodeType属性用于查找我们要引用的节点的类型.特定节点的类型以数字形式返回. DOM nodeType属性是一个只读属性. 返回值:它根据节点的类型返回一个数值. 1:如果node是元素 ...

  3. html+dfn标签,HTML DOM DFN用法及代码示例

    DOM DFN对象用于表示HTML 标签. getElementById()访问DFN元素. 用法: document.getElementById("ID"); 其中" ...

  4. iframe展示html源代码,HTML DOM IFrame用法及代码示例

    HTML DOM中的IFrame对象属性用于创建和访问对象中的元素.内联框架用于将另一个文档嵌入当前HTML文档中. 用法: 它用于访问元素.var x = document.getElementBy ...

  5. html 精美list,HTML DOM DList用法及代码示例

    DOM DList对象用于表示HTML 用法: document.getElementById("ID");< 其中"id"是分配给"dl&qu ...

  6. html dom.parent,HTML DOM offsetParent用法及代码示例

    在HTML中,offsetParent属性用于返回元素的最接近的祖先.返回的祖先的位置必须不是静态的.如果将元素设置为display =" none",则offestParent属 ...

  7. html parent()属性,HTML DOM parentElement用法及代码示例

    DOM parentElement属性用于返回特定子元素的父元素.这是一个只读属性. parentElement和parentNode属性相似,唯一的区别是,如果父节点不是元素,则parentElem ...

  8. html table clonenode,HTML DOM cloneNode()用法及代码示例

    DOM cloneNode()方法用于复制或克隆在其上调用cloneNode()方法的节点.例如,可以使用此方法将列表项从一个列表复制到另一个列表. 用法: yourNode.cloneNode([d ...

  9. html中offsetleft属性,HTML DOM offsetLeft用法及代码示例

    DOM offsetLeft属性用于返回像素的左位置.此位置相对于offsetParent元素的左侧. 用法: element.offsetLeft 返回值:它返回以像素为单位表示元素左侧位置的数字. ...

  10. html before添加图片,HTML DOM before()用法及代码示例

    before()方法用于在ChildNode父级的子级列表中插入一组Node对象或HTML DOMString对象.元素被插入到我们提到的ChildNode之前. 用法: ChildNode.befo ...

最新文章

  1. 盘点:崛起中的九大HTML5开发工具
  2. 5 大常用机器学习模型类型总结
  3. linux下mysql数据库操作命令
  4. oracle索引使用例子,Oracle中利用函数索引处理数据倾斜案例
  5. 《c程序设计语言》练习1-12
  6. [转]CPoint+CSize+CRect学习大纲
  7. CentOS系统根目录下各个目录存放的内容
  8. 自动化初级工程师必读知识点总结(免费资料获取)
  9. C++算法学习(动态规划算法)
  10. winFrom窗体样式
  11. vs code代码格式化配置
  12. 如何破解CuteFTP 4.0,CuteFTP,逆向工程技术
  13. Windows下使用c++编译hiredis.lib,Win32_Interop.lib
  14. GET 和POST的用法
  15. 房屋登记官考核模拟题(6)
  16. 为什么书上说是 TCP 四次挥手,但是实际会出现 TCP 三次挥手?
  17. Mac下7z格式文件解压
  18. 怎么把html表格转化为excel,导出html到excel表格数据格式-如何将html转换成excel
  19. 最新前端开发面试笔试题及答案---图片(面试题系列持续更新中)(4)
  20. 2018 Macbook pro 15(10.13.6)安装Nvidia 1070(Aorus Gaming Box)显卡驱动

热门文章

  1. 加一 — Python
  2. pscc2018安装服务器无响应,win10系统无法安装ps cc2018提示Microsoft visualc++ 2017的解决方法...
  3. pythonturtle魔法阵_python turtle 库绘制简单魔法阵
  4. 你知道哪六种传统早餐不能吃吗?
  5. html5 保存 搜索历史,前端实现搜索记录功能也就是天猫app历史记录存储方便浏览 - 今天的代码你撸了嘛...
  6. 大学是不是每个专业都要学计算机,大学科目里计算机是必修课程吗?是不是每个专业都要学?...
  7. torch.nn.functional.normalize详解
  8. 第3课:中移物联网蜂窝通信模组OpenCPU探秘
  9. Windows10压缩卷时可压缩空间远小于实际剩余空间的解决方案
  10. 应届毕业生外包公司体验