使用原生DOM的最近的祖先匹配选择器？
是否有人在DOM api中处理jQuery.closest（）等价物？
看起来选择器级别2草案添加了相当于jQuery.is（）的matches（） ，因此本机最接近应该更容易编写。 是否添加了closest()选择器closest() ？
Element.closest（）
它的支持
使用Element.matches（）实现此类函数在性能方面似乎不是最佳的，因为看起来match（）每次测试父级时都会调用querySelectorAll（），而只有一次调用就足够了。
这是MDN上最近（）的polyfill。 注意对querySelectorAll（）的单个调用
if (window.Element && !Element.prototype.closest) { Element.prototype.closest = function(s) { var matches = (this.document || this.ownerDocument).querySelectorAll(s), i, el = this; do { i = matches.length; while (--i >= 0 && matches.item(i) !== el) {}; } while ((i < 0) && (el = el.parentElement)); return el; }; }
但请记住，像这样实现的函数将无法在未附加的树上正常工作（与document.documentElement根分离）
//Element.prototype.closestTest = function(s){...as seen above...}; var detachedRoot = document.createElement("footer"); var child = detachedRoot.appendChild(document.createElement("div")); detachedRoot.parentElement; //null child.closestTest("footer"); //null document.documentElement.append(detachedRoot); child.closestTest("footer"); //
虽然在Firefox 51.0.1中实现的nearest（）似乎可以与分离树一起使用
document.documentElement.removeChild(detachedRoot); child.closestTest("footer"); //null child.closest("footer"); //
建立Alnitak的答案。 这是使用matchesSelector的工作当前实现，它现在在DOM规范中matches 。
// get nearest parent element matching selector function closest(el, selector) { var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector; while (el) { if (matchesSelector.call(el, selector)) { break; } el = el.parentElement; } return el; }
浏览器支持很棒： http ： //caniuse.com/matchesselector
好像Chrome 40将带来一个原生的element.closest()方法（ http://blog.chromium.org/2014/12/chrome-40-beta-powerful-offline-and.html ），这里指定： https：// dom.spec.whatwg.org/#dom-element-closest
考虑到matchesfunction，这听起来应该很容易，尽管这还没有被广泛支持：
function closest(elem, selector) { while (elem) { if (elem.matches(selector)) { return elem; } else { elem = elem.parentElement; } } return null; }
麻烦的是， matchesfunction没有得到适当的支持。 由于它仍然是一个相对较新的API，因此可以在Chrome和Safari中使用mozMatchesSelector在Firefox中使用mozMatchesSelector 。
使用element.closest（），我们可以找到最近的祖先匹配选择器。 此方法将选择器列表作为参数并返回最近的祖先。 根据Rob的评论，这个API可以从chrome 41和FF 35获得。
正如whatwg specs https://dom.spec.whatwg.org/#dom-element-closest中所述
示例：以下HTML将显示警告消息“true”
一点点递归就可以了。
// get nearest parent element matching selector var closest = (function() { var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector; return function closest(el, selector) { return !el ? null : matchesSelector.call(el, selector) ? el : closest(el.parentElement, selector); }; })();