vue click時獲取與操作父、子、兄弟元素

methods: { click(event){ // 當前點擊的元素 event.target; // 綁定事件的元素 event.currentTarget; // （target與currentTarget的區別主要體現在使用事件委托時，發生事件委托時， // 點擊的元素與綁定事件的元素非同一元素，反之不發生事件委托時，兩者相同，是同一元素） // 獲得綁定事件元素的前一個節點信息（包含元素節點、屬性節點、文本節點、注釋節點） event.currentTarget.previousSibling; // 獲得綁定事件元素的前一個元素節點（只包含元素節點，只有html內容） event.currentTarget.previousElementSibling; // 下一個元素信息獲取使用 nextSibling、nextElementSibling // 獲得綁定事件元素的父節點信息 event.currentTarget.parentNode; // 獲得綁定事件元素的父級元素 event.currentTarget.parentElement; // 獲得綁定事件元素的第一個子節點信息 event.currentTarget.firstChild; // 獲得綁定事件元素的第一個子元素 event.currentTarget.firstElementChild; // 獲得綁定事件元素中id為ceshi的元素集合 event.currentTarget.getElementById("ceshi"); // 獲得綁定事件元素中class為ceshi的元素集合 event.currentTarget.getElementsByClassName("ceshi"); // 獲得綁定事件元素的的內容（類似jquery的text()） event.currentTarget.textContent; // 獲得綁定事件元素的的內容（類似jquery的html()） event.currentTarget.innerHTML; // 獲得綁定事件元素的ceshi屬性（類似jquery的attr('ceshi')） event.currentTarget.getAttributeNode("ceshi"); // 點擊刪除當前元素 event.currentTarget.parentElement.removeChild(event.currentTarget); // 點擊刪除當前元素的父級元素 event.currentTarget.parentElement.parentElement.removeChild(event.currentTarget.parentElement); } }