Нужно выбрать те span на странице, которые не являются потомками заголовков (h1 - h6). Есть много селекторов для потомков, но вот селектора, который бы проверял принадлежность родителю, я, увы, не нашел.
Пример:
one
HEY
twoHEY2
threeНужно выбрать span'ы за исключением тех, что в h2 и h3
Ответ
Выбираем все на странице.
Для каждого пробегаемся по всем его родителям вплоть до document (можно было и только до ).
Проверяем имя тега каждого родителя. Если оно входит в
document.addEventListener('DOMContentLoaded', onDomReady);
function onDomReady() {
var allSpans = document.getElementsByTagName('span');
var resultSpans = [];
var regExp = /^H\d$/i;
for (var i = 0; i < allSpans.length; i++) {
var parent = allSpans[i].parentNode;
while (parent != document) {
if (regExp.test(parent.tagName)) {
break;
}
parent = parent.parentNode;
}
if (parent == document) {
resultSpans.push(allSpans[i]);
}
}
for (var i = 0; i < resultSpans.length; i++) {
resultSpans[i].style.color = 'red';
}
};
not in hX
simple
То же самое с jQuery (если кому-то понадобится):
$(document).ready(function() {
var headers = [];
for (var i = 0; i <= 9; i++) {
headers.push('h' + i);
}
var headersSelector = headers.join(',');
var $resultSpans = $('span').filter(function() {
return $(this).parents(headersSelector).length == 0;
});
$resultSpans.css('color', 'red');
});
not in hX
simple
