使用递归查找父元素,知道查到想要的元素,然后return getParentTag(startTag) { var self = this; // 传入标签是否是DOM对象 if (!(startTag instanceof HTMLElement)) return; // 父级标签是否是body,是着停止返回
使用递归查找父元素,知道查到想要的元素,然后return
getParentTag(startTag) { var self = this; // 传入标签是否是DOM对象 if (!(startTag instanceof HTMLElement)) return; // 父级标签是否是body,是着停止返回集合,反之继续 let nodeName = ""; if (startTag.parentElement) { nodeName = startTag.parentElement.nodeName ? startTag.parentElement.nodeName : ""; } else { return; } if ("BODY" !== nodeName) { if (nodeName == "TD") { return startTag.parentElement; } else { if (startTag.parentElement.parentElement) { return self.getParentTag(startTag.parentElement); } else { return false; } } } }
调用函数
this.getParentTag(event.target);
补充知识:Vue.js如何获得兄弟元素,子元素,父元素(DOM操作)
我就废话不多说了,大家还是看代码吧~
<button @click = “clickfun($event)”>点击</button> methods: { clickfun(e) { // e.target 是你当前点击的元素 // e.currentTarget 是你绑定事件的元素 #获得点击元素的前一个元素 e.currentTarget.previousElementSibling.innerHTML #获得点击元素的第一个子元素 e.currentTarget.firstElementChild # 获得点击元素的下一个元素 e.currentTarget.nextElementSibling # 获得点击元素中id为string的元素 e.currentTarget.getElementById("string") # 获得点击元素的string属性 e.currentTarget.getAttributeNode('string') # 获得点击元素的父级元素 e.currentTarget.parentElement # 获得点击元素的前一个元素的第一个子元素的HTML值 e.currentTarget.previousElementSibling.firstElementChild.innerHTML } },
以上这篇vue递归获取父元素的元素实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持易盾网络。