Как преобразовать jquery.on ('mouseenter') в собственный javascript?

Question

я следующий код:

$('body').on('mouseenter', 'label', function(){ 
     if(this.offsetWidth < this.scrollWidth){ 
      if(!this.getAttribute('title')) { 
       this.setAttribute('title', this.innerHTML); 
      } 
     } 
     else{ 
      this.removeAttribute('title'); 
     } 
    }); 

Но в моем проекте, мы должны иметь меньше зависимостей с JQuery. Поэтому мне нужно переписать метод («mouseenter»). я пытался что-то вроде этого:

var matches; 

    (function (doc) { 
     matches = 
       doc.matchesSelector || 
       doc.webkitMatchesSelector || 
       doc.mozMatchesSelector || 
       doc.oMatchesSelector || 
       doc.msMatchesSelector; 
    })(document.documentElement); 

    document.addEventListener('mouseenter', function (e) { 
     if (matches.call(e.target, 'label')) { 
      if (this.offsetWidth < this.scrollWidth) { 
       if (!this.getAttribute('title')) { 
        this.setAttribute('title', this.innerHTML); 
       } 
      } 
      else { 
       this.removeAttribute('title'); 
      } 
     } 
    }, false); 

Но это не работает, потому что стрелять только один раз (на MouseEnter на документе). Я не могу получить все элементы с меткой тега и добавить к ним прослушиватель событий, потому что у меня есть много ярлыков в разных частях моего приложения. Можно ли получить полный эквивалент функции jquery?

Answer 1

Вы можете использовать вместо mouseover и изменить первую строку внутри события обратного вызова, так var matches можно опустить:

document.addEventListener('mouseover', function (e) { 
    if (e.target.tagName.toLowerCase() == 'label') { 

    /* rest of your code */ 

}, false);