vue遞迴獲取父元素的元素例項
阿新 • • 發佈:2020-08-08
使用遞迴查詢父元素,知道查到想要的元素,然後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遞迴獲取父元素的元素例項就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支援我們。