首页
学习
活动
专区
圈层
工具
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何遍历DOM

在本教程中,我们回顾一些HTML术语,这对使用 JS 和DOM非常重要,我们会介绍一下DOM树,节点,以及如何识别最常见的节点类型。最后,创建一个 JS 程序来交互式地修改DOM。...DOM 树和节点 DOM中的所有元素都被定义为节点。节点的类型有很多种,但我们最常用的主要有三种: 元素节点 文本节点 注释节点 当HTML元素是DOM中的一个项时,它被称为元素节点。...DOM由嵌套节点的树结构组成,通常称为DOM树。 我们知道祖先的家谱,该谱系由父母,孩子和兄弟姐妹组成。 DOM中的节点也称为父级,子级和同级,具体取决于它们与其他节点的关系。...了解DOM中的空白符更多知识请访问 https://developer.mozilla.org......使用事件修改DOM 到目前为止,我们只看到了如何在控制台中修改DOM,接着我们通过事件的方式来跟 Dom 玩玩。

9K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    jQuery操作DOM元素

    实现上述两个功能当然可以使用原生js来完成,但在实际开发过程中很少这样做,通常会使用一些别人封装好的js库来辅助我们的工作,jQuery就是这些辅助库中的一员。...的方法只有jQuery对象才可以调用,DOM对象不能调用。...DOM对象和jQuery对象的相互转换 //DOM转jQuery var win=$(window);//将window转换为jQuery对象 //jQuery对象win转DOM对象 win.get[0...(不包括子元素的子元素),selector表示选择器,可省略 find('selector') 根据selector获取元素的所有子元素(包括子元素的子元素),selector不可省略 each() 遍历元素数组...最后说一点,同一个jQuery方法,可能会因为jQuery版本的不同而产生不同的效果。 版权声明 本文为作者原创,版权归作者雪飞鸿所有。

    2.7K40

    jquery树遍历

    style> body { font-size:16px; font-weight:bolder; } p { margin:5px 0; } jquery-latest.js...$("div").children(".selected").css("color", "blue"); .closest() 从元素本身开始,在DOM....closest() .parents() 开始于当前元素 开始于父元素 在 DOM 树中向上遍历,直到找到与提供的选择器相匹配的元素 向上遍历DOM树到文档的根元素,每个祖先元素加入到临时集合,如果提供一个选择器...,则会使用该选择器在集合中进行过滤 返回包含零个或一个元素的jQuery对象 返回包含零个,一个或多个元素的jQuery对象 .find() 得到当前匹配的元素集合中每个元素的后代, 由一个选择器,jQuery....nextUntil() 通过选择器,DOM节点,或jQuery对象得到每个元素接下来的所有的兄弟元素,但不包括匹配的元素。

    87930

    DOM 元素的循环遍历

    ('popo') 获取 name 属性为 'popo' 的 dom 元素(若多个元素有相同的 name 属性,返回第一个) for-of、for 循环可获取每个 dom 元素: for(let val...(每个dom元素) for(let i = 0; i < a.length; i++) { console.log(a[i]) } // dom // ......(每个dom元素) query 方式 query 方式获取的 dom 元素,可使用==forEach、for-in、for-of、for==循环 forEach、for-of、for 循环的结果无差别...遍历直接子级元素 假设 html 如下,要遍历出 div 中的所有直接子级的元素节点: hello world 遍历所有节点 深度优先遍历:当同时有兄弟节点和子节点的时候,总是优先遍历子节点 function getChildren(parent) { // 如果当前节点是元素节点,输出当前元素 parent.nodeType

    6.5K60
    领券