Реализация jQuery.parents() на Vanilla JS

В современном JavaScript появилось столько возможностей, что в библиотеках, подобных jQuery, нет никакой надобности. К сожалению, не все функции доступны в Vanilla JS, например метода, аналогичного методу parents() в JavaScript нет, поэтому я написал аналог.

Код

Element.prototype.parents = function(selector) {
	var elements = [];
	var elem = this;
	var ishaveselector = selector !== undefined;
 
	while ((elem = elem.parentElement) !== null) {
		if (elem.nodeType !== Node.ELEMENT_NODE) {
			continue;
		}
 
		if (!ishaveselector || elem.matches(selector)) {
			elements.push(elem);
		}
	}
 
	return elements;
};

Использование

Применить действие для множества элементов можно так:

[].forEach.call(document.querySelector('#main').parents('.cat'), function(element) {
	element.style.backgroundColor = '#008800';
});

Проверить на существование родителя с классом .animals (jsfiddle):

[].forEach.call(document.querySelectorAll('.animal'), function(element) {
	element.addEventListener('mousedown', function() {
		var isBobAnimal = this.parents('.animals').length !== 0;
		if (isBobAnimal) {
			alert('Bob is animal');
		} else {
			alert('Bob is spy!');
		}
	});
});

Я адаптировал последний пример использования jQuery.parents() отсюда, посмотреть в работе можно здесь: https://jsfiddle.net/ziggi/1aec377b/
Ещё один пример: https://jsfiddle.net/ziggi/5qm4xnku/

Полезные ссылки

Перейти к верхней панели