JavaScript上的defaultPrevented介绍

无论你是从旧的on_____ 属性还是addEventListener ，你都知道事件在现代JavaScript中驱动着用户体验。如果你使用过事件，你知道preventDefault() 和stopPropagation() 经常被用来处理事件。有一件事你可能不知道：在事件上有一个defaultPrevented proptery!

考虑一下下面的代码块：

// Specific to a link
const link = document.querySelector('#my-link');
link.addEventListener('click', e => e.preventDefault());

// A larger document scope
document.addEventListener('click', documentClickHandler);
function documentClickHandler(event) {
    if (event.defaultPrevented) {// Using the property
        // Do one thing if the click has been handled
    }
    else {
        // Otherwise do something fresh
    }
}

当preventDefault 在一个给定的事件上被调用时，defaultPrevented 属性被切换到true 。 由于事件的传播，该事件以这个defaultPrevented 的值向上冒泡。

我已经处理了二十年的事件，直到现在才知道这个属性的存在。 defaultPrevented 的伟大之处在于，它与事件保持一致，而不需要在全局范围内对其进行跟踪!