Проверьте, если объект HTML находится внутри другого HTML объекта

Question

У меня есть пример, как это:

<div id="President"> 
    <div id="Congressman"> 
    <div id="Senator"> 
     <div id="Major"></div> 
    </div> 
    </div> 
</div> 

есть простой способ в JavaScript, или JQuery, что мы можем проверить, если DIV «Major» является дочерним элементом всех других дивизий? Спасибо.

Answer 1

Использование Javascript node.contains(other node)

var qS = function(v) { return document.querySelector(v); }; 
 

 
console.log(qS('#President').contains(qS('#Major')))

<div id="President"> 
 
    <div id="Congressman"> 
 
    <div id="Senator"> 
 
     <div id="Major"></div> 
 
    </div> 
 
    </div> 
 
</div>

---

обновляется на основе комментарий, объединяющий jQuery и простой javascript

console.log($('#President')[0].contains($('#Major')[0]))

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="President"> 
 
    <div id="Congressman"> 
 
    <div id="Senator"> 
 
     <div id="Major"></div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 2

Это не самый лучший способ сделать это, но это просто один, и он работает

$('#President').find('#Major').length !== 0 

Answer 3

Использование has():

console.log($('#President').has('#Major').length > 0)

<script src="https://code.jquery.com/jquery-3.1.1.min.js" 
 
\t integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" 
 
\t crossorigin="anonymous"> 
 
</script> 
 
<div id="President"> 
 
    <div id="Congressman"> 
 
    <div id="Senator"> 
 
     <div id="Major"></div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 4

ли дети всех других дивы (с помощью JQuery):

$('#Major').parents('#Senator,#Congressman,#President').length === 3