2017-01-23 1 views
0

// div # grand-node에서 가장 깊게 중첩 된 자식을 추출하는 함수 deepestChild()를 정의합니다. (당신이 요소를 반복하고 그들에 querySelector()와 querySelectorAll()를 호출 할 수 있습니다, 기억 //Javascript를 사용하여 dom에있는 요소에서 가장 깊게 중첩 된 자식을 꺼내는 방법은 무엇입니까?

<!DOCTYPE html> 
<html> 
    <head> 
    <title>JavaScript Hide and Seek</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <link rel="stylesheet" href="node_modules/mocha/mocha.css" /> 
    </head> 
    <body> 
    <main id="app"> 
     <ul class="unranked-list"> 
     <li>2</li> 
     <li>5</li> 
     <li>4</li> 
     </ul> 

     <ul class="ranked-list"> 
     <li>1</li> 
     <li>2</li> 
     </ul> 

     <ul class="ranked-list"> 
     <li>12</li> 
     <li>11</li> 
     <li>10</li> 
     </ul> 

     <div id="nested"> 
     <div> 
      <div> 
      <div> 
       <div class="target"> 
       1 
       </div> 
      </div> 
      </div> 
     </div> 
     </div> 

     <div id="grand-node"> 
     <div> 
      <div> 
      <div> 
       <div> 
       boo! 
       </div> 
      </div> 
      </div> 
     </div> 
     </div> 
    </main> 
+0

읽어보십시오 : [왜 누군가가 나를 도울 수 있습니까?] 실제 질문이 아닙니까?] (http://meta.stackoverflow.com/q/284236) – EJoshuaS

+0

오! 언급 해 주셔서 고맙습니다. 저는이 사이트에 기본적으로 새롭지만, 지금 수정되었습니다. – DeUsman

답변

0

jQuery를 사용하여 :.

//pass in a jquery object 
function deepestChild(node) { 
    node.find(':last'); 
} 

var node = $('#grand-node'); 
var mostDeep = deepest(node); 

jQuery를하지 않고 :

var nodes = document.querySelectorAll('#grand-node div'); 
var mostDeep = nodes[nodes.length- 1]; 

경우 함수를 만들 필요가 있습니다. 다른 가장 깊은 자식을 검색하는 경우 융통성을 제공합니다. id 매개 변수는 검색을 시작할 요소의 ID이고 요소 매개 변수 당신이 찾고있는 요소의 유형입니다 :

function deepestChild(id, element) { 
    var nodes = document.querySelectorAll(`#${id} ${element}`); 
    if(!nodes.length) return false; 
    return nodes[nodes.length-1]; 
}