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

js如何引用同级元素

具体效果 示例效果 https://coder.itclan.cn/fontend/js/17-yinyong-tongji-elem/ 具体描述 在网页中,同级(兄弟)元素,指的是拥有相同的直接父级元素元素...,并且往往指的是同类的元素,同类元素在实际开发中遇到的比较多 比如:列表li,并列的按钮等,当需要做一些特殊的效果时,可以对其他同级元素进行一些操作,满足特定的网页要求 比如:隔行填充颜色等 原生方法实现...以下是通过原生js实现,点击按钮时,获取按钮的值 // 获取同级按钮元素的value function getLevelBtnVal(btn) { var p = btn.parentNode...; // 通过点击按钮获取到它的父级节点 var children = p.childNodes; // 通过childNodes可以得到父节点的所有子节点 // 遍历子节点...,同级元素拥有相同的父级元素都是p,那么就可以得到除自身以外的的同级元素,如果还需要排除同一类别的话,那么可以使用节点的nodeType属性来加以区别 Vue版本实现 在Vue里面,就不用类似原生js

7.8K40
您找到你想要的搜索结果了吗?
是的
没有找到

DOM 元素的循环遍历

:ele 的下一个同辈节点 previousSibling:ele 的上一个同辈节点 因为 childNodes 包含看不见的空格文本,还有注释等内容,所以使用起来不是太方便 因此,js 又重新引入了元素树的概念...这个在我们实际应用中,用的比较普遍 元素树:仅仅包含元素节点的树结构,不是一颗新树,尽是节点数的子集 为元素新增了下面几个属性: parentElement:节点的父元素 children:返回节点的所有子元素...遍历直接子级元素 假设 html 如下,要遍历出 div 中的所有直接子级的元素节点: hello world cookieParse() 用 firstChild,lastChild 进行元素遍历 let list = document.getElementById('list')...遍历所有节点 深度优先遍历:当同时有兄弟节点和子节点的时候,总是优先遍历子节点 function getChildren(parent) { // 如果当前节点是元素节点,输出当前元素 parent.nodeType

6K60

js中map遍历数组对象_js遍历数组

forEach()和map()都是遍历数组的方法,用法类似,但是还是有很大区别: 相同点:       1.都是循环遍历数组中的每一项;       2.在遍历中执行匿名函数都可以接收三个参数,分别为...:遍历过程的每一项、遍历序号(索引值)、原数组;       3.执行的匿名函数中 的this都指向window。...arr.forEach(function(i,index,arr){ sum += i; console.log("sum的值为:",sum); }) //执行5次,最终结果 10 ** js...中 map 遍历数组 ** map 方法会迭代数组中的每一个元素,并根据回调函数来处理每一个元素,最后返回一个新数组。...在我们的例子中,回调函数只有一个参数,即数组中元素的值 (val 参数) ,但其实,你的回调函数也可以支持多个参数,譬如:元素的索引index、原始数组arr。

19.4K30

遍历删除List中的元素

遍历删除List中的元素有很多种方法,当运用不当的时候就会产生问题。...下面主要看看以下几种遍历删除List中元素的形式: 1.通过增强的for循环删除符合条件的多个元素 2.通过增强的for循环删除符合条件的一个元素 3.通过普通的for删除删除符合条件的多个元素 4.通过...Iterator进行遍历删除符合条件的多个元素 Java代码 /** * 使用增强的for循环 * 在循环过程中从List中删除元素以后,继续循环List时会报ConcurrentModificationException...== 2) { students.remove(stu); break; } } } Java代码 /** * 这种遍历有可能会遗漏某个元素...当访问的元素 * 索引超过了当前的List的size后还会出现数组越界的异常,当然这里不会出现这种异常, * 因为这里每遍历一次都重新拿了一次当前List的size。

4.6K60

HashMap、LinkedHashMap元素遍历机制探讨

1.HashMap的遍历机制 HashMap 提供了两个遍历访问其内部元素Entry的接口:               1.      ...实际上,第二个借口表示的Key的顺序,和第一个接口返回的Entry顺序是对应的,也就是说:这两种接口对HashMap的元素遍历的顺序相相同的。 ...但是,我们有时候想要遍历HashMap的元素Entry的顺序和其存储的顺序一致,HashMap显然不能满足条件了。而LinkedHashMap则可以满足这个需要。 2....由此,就可以保证遍历LinkedHashMap内元素的顺序,就是Entry插入到LinkedHashMap中的顺序。...总结 1.HashMap对元素遍历顺序跟Entry插入的顺序无关,而LinkedHashMap对元素遍历顺序可以跟Entry插入的顺序保持一致。

1.2K20

java hashmap 遍历删除元素_java 中 HashMap 遍历与删除

HashMap的遍历 方法一、这是最常见的并且在大多数情况下也是最可取的遍历方式 /*** 在键值都需要时使用*/Map map = new HashMap();for (Map.Entryentry...首先,在老版本java中这是惟一遍历map的方式。另一个好处是, * 你可以在遍历时调用iterator.remove()来删除entries,另两个方法则不能。...否则使用方法一(键值都要) HashMap之删除元素 如果采用第一种的遍历方法删除HashMap中的元素,Java很有可能会在运行时抛出异常 HashMap myHashMap = new HashMap...HashMap的元素过程中删除了当前所在元素,下一个待访问的元素的指针也由此丢失了。...(Map.Entryitem : myHashMap.entrySet()){ System.out.println(item.getKey()); } 运行结果没有显示,表明HashMap中的元素被正确删除了

2.3K10
领券