Javascript 锚上的委托单击事件

我试图以锚定标记为目标并触发一个ajax请求。使用jQuery非常简单：

$(document.body).on('click', "a", function (event) {
    'use strict';
    if ($(this).is('.a-btn')) {
        event.preventDefault();
    } else if ($(this).is('.no-sp')) {
        //
    } else {
        address = $(this).attr("href")
        event.preventDefault();
        App.Ajax.Page(address + '/');
    }
});

然而，使用本机javascript，我可以想象使用

event.target

就可以做到这一点

但这不起作用，因为事件始终以锚标记内的任何元素为目标：

App.Ajax.Navigate = function () {
    'use strict';
    document.body.addEventListener('click', function (e) {
        e.preventDefault();
        console.log(e.currentTarget);
        if (e.target.tagName === 'a') {
            var element, link;
            element = e.target;
            link = element.href;

            if (App.HTML.hasClass(element, 'a-btn')) {
                e.preventDefault();
            } else if (App.HTML.hasClass(element, 'no-sp')) {
                return;
            } else {
                e.preventDefault();
                App.Ajax.Page(link);
            }

        }
    }, true);

    window.onpopstate = function (event) {
        App.Page.type = event.state.type;
        App.Page.Replace(event.state.content, event.state.type, App.Empty, false);
    };
};

我想使用本机javascript来完成jquery在第一个代码段中所做的事情，这可能吗？

-这里有两个人

event.target.closest("a")

对于大多数浏览器，不要忘记polifill

---

（函数（e）{
如果（！e.matches）{
e、 matches=e.mozMatchesSelector | e.msMatchesSelector | e.oMatchesSelector | e.webkitMatchesSelector；
}
如果（！e.最近）{
e、 最近的=函数（css）{
对于（var node=this；node；node=node.parentElement）{
if（node.matches（css））{
返回节点；
}
}
返回null；
} 
}
})（要素.原型）；

我不想使用在所有浏览器中都不支持的实验方法。@epascarello，但您可以使用polifill。请参阅答案中链接的2个解决方案（已更新，现在它指向文档的英文版本）。@SebastianOlsen，然后将polifill代码复制到您自己的方法中。