欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Vue事件獲取事件對象之event.currentTarget詳解

 更新時間：2024年03月24日 08:42:16   作者：姜泥斷了姒  
這篇文章主要介紹了Vue事件獲取事件對象之event.currentTarget,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教

vue事件獲取事件對象event.currentTarget

在學(xué)習(xí)vue的時候，在進行tab欄切換的時候，突然發(fā)現(xiàn)不能像jquery一樣$(this)獲取事件，然后才發(fā)現(xiàn)在vue里面獲取事件對象可以用event.currentTarget來獲取

獲取事件對象

  • js的事件可以直接用this獲取事件對象，
  • jQuery可以使用$(this)來獲取事件對象。
  • vue借助事件的 event 對象 currentTarget 獲取事件對象

event.currentTarget

  • HTML
 <ul>
     <li v-for="(item,item2) in catitmlst" v-bind:index="item2" v-on:click="eventObj">
         <span id="eventobj">事件對象</span>
     </li>
</ul>
  • JS
//獲取事件對象
    eventObject(event){
        let html = event.currentTarget
        console.log(html)
        //獲得點擊元素的前一個元素
        event.currentTarget.previousElementSibling.innerHTML
        //獲得點擊元素的第一個子元素
        event.currentTarget.firstElementChild
        //獲得點擊元素的下一個元素
        event.currentTarget.nextElementSibling
        //獲得點擊元素中id為eventobj的元素
        event.currentTarget.getElementById("eventobj")
        //獲得點擊元素的index(自定義的屬性)
        event.currentTarget.getAttribute('index')
        //獲得點擊元素的父級元素
        event.currentTarget.parentElement
        //獲得點擊元素的前一個元素的第一個子元素的HTML值
        event.currentTarget.previousElementSibling.firstElementChild.innerHTML
    }

我目前還不是特別清楚，等我徹底搞明白了，我會在重新解釋一下vue獲取事件對象。

IE不兼容event.currentTarget

vue開發(fā)時實現(xiàn)點擊選中獲取DOM效果使用：

JSON.parse(event.currentTarget.nextElementSibling.innerText);

但IE不兼容，改換為：

JSON.parse(event.srcElement.parentNode.lastChild.innerText);

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論