Po prostu musiałem podzielić się „moim”.
Chociaż koncepcyjnie to samo co odpowiedź Asafa (korzystająca z tej samej kompatybilności między przeglądarkami, nawet IE6), jest o wiele mniejsza i przydaje się, gdy rozmiar jest na wagę złota i / lub gdy nie jest tak często potrzebny.
function childOf(/*child node*/c, /*parent node*/p){ //returns boolean
while((c=c.parentNode)&&c!==p);
return !!c;
}
.. lub jako jedna linijka ( tylko 64 znaki !):
function childOf(c,p){while((c=c.parentNode)&&c!==p);return !!c}
i jsfiddle tutaj .
Użycie:
childOf(child, parent) zwraca wartość logicznątrue| false.
Objaśnienie:
while ocenia tak długo, jak ocenia warunek whiletrue.
Operator&&(AND) zwraca wartość logiczną „prawda / fałsz” po ocenie lewej i prawej strony, ale tylko wtedy, gdy po lewej stronie była prawda ( left-hand && right-hand) .
Strona lewa (z &&) wynosi: (c=c.parentNode).
Będzie to pierwszy przypisać parentNodeod cdo c, a następnie operator AND oceni uzyskany cjako wartość logiczną.
Ponieważ parentNodezwraca, nulljeśli nie ma już rodzica i nulljest konwertowany false, pętla while poprawnie zatrzyma się, gdy nie będzie już rodziców.
Z boku po prawej stronie (z &&) wynosi: c!==p. Operator porównania jest „ nie dokładnie równa”. Więc jeśli rodzic dziecka nie jest rodzicem (podałeś), to ocenia , ale jeśli rodzic dziecka jest rodzicem, to ocenia . Jeśli
więc zostanie ustawiona wartość false, operator powróci jako warunek while, a pętla while zatrzyma się. (Zauważ, że nie ma potrzeby używania ciała chwilowego i wymagany jest średnik zamykający .)
!==truefalse
c!==p&&false;
Więc kiedy pętla while kończy się, cjest albo węzłem (nie null), kiedy znajduje nadrzędny OR, albo jest null(kiedy pętla biegnie do końca bez znalezienia dopasowania).
W ten sposób tylko returnfakt (konwertowane wartości logicznej, natomiast węzła) o: return !!c;: z !( NOToperator) odwraca wartość logiczną ( truestaje się falsei vice versa).
!ckonwertuje c(węzeł lub null) na wartość logiczną, zanim będzie mógł odwrócić tę wartość. Tak więc dodanie second !( !!c) konwertuje to fałsz z powrotem na true (dlatego podwójne !!jest często używane do „konwersji wszystkiego na boolean”).
Dodatkowo:
treść / ładunek funkcji jest tak mały, że w zależności od wielkości liter (np. Kiedy nie jest często używany i pojawia się tylko raz w kodzie), można nawet pominąć funkcję (zawijanie) i po prostu użyć pętli while:
var a=document.getElementById('child'),
b=document.getElementById('parent'),
c;
c=a; while((c=c.parentNode)&&c!==b); //c=!!c;
if(!!c){ //`if(c)` if `c=!!c;` was used after while-loop above
//do stuff
}
zamiast:
var a=document.getElementById('child'),
b=document.getElementById('parent'),
c;
function childOf(c,p){while((c=c.parentNode)&&c!==p);return !!c}
c=childOf(a, b);
if(c){
//do stuff
}