纯JavaScript以检查是否有悬停(没有设置在鼠标悬停/出)

我看到这个jquery语法:

if($(element).is(':hover')) { do something}

因为我没有使用jquery,我正在寻找最好的方法来做这个纯粹的javascript。我知道我可以保留一个全局变量,并使用mouseover和mouseout设置/取消设置,但我想知道是否有一些方法通过dom来检查元素的本机属性?可能是这样的:

if(element.style.className.hovered === true) {do something}

同样,它必须是跨浏览器兼容的

最佳答案
首先,您需要跟踪哪些元素被徘徊。这是一种做法:

(function() {
    var matchfunc = null, prefixes = ["","ms","moz","webkit","o"], i, m;
    for(i=0; i<prefixes.length; i++) {
        m = prefixes[i]+(prefixes[i] ? "Matches" : "matches");
        if( document.documentElement[m]) {matchfunc = m; break;}
        m += "Selector";
        if( document.documentElement[m]) {matchfunc = m; break;}
    }
    if( matchfunc) window.isHover = function(elem) {return elem[matchfunc](":hover");};
    else {
        window.onmouseover = function(e) {
            e = e || window.event;
            var t = e.srcElement || e.target;
            while(t) {
                t.hovering = true;
                t = t.parentNode;
            }
        };
        window.onmouseout = function(e) {
            e = e || window.event;
            var t = e.srcElement || e.target;
            while(t) {
                t.hovering = false;
                t = t.parentNode;
            }
        };
        window.isHover = function(elem) {return elem.hovering;};
   }
})();

转载注明原文:纯JavaScript以检查是否有悬停(没有设置在鼠标悬停/出) - 代码日志