중첩 된 DocumentFragment에 액세스

Question

Chrome의 콘솔에서 요소를 완벽하게 탐색 할 수 있지만 중첩 된 DocumentFragment에 대한 참조를 childNodes 또는 firstChild으로 가져올 수 없습니다.

여기 jsFiddle의 코드입니다 : http://jsfiddle.net/Ge8au/2/

여기에 코드입니다 :

function withoutJquery(html) 
{ 
    var temp = document.createElement("div"); 
    temp.innerHTML = html; 

    var fragment = document.createDocumentFragment(); 
    var child; 

    while (child = temp.firstChild) 
    { 
     fragment.appendChild(child); 
    } 

    return fragment.firstChild; 
} 


function withJquery(html) 
{ 
    var fragment = document.createDocumentFragment(); 

    fragment.appendChild(jQuery.buildFragment([html],document)); 

    return fragment.firstChild; 
} 


var ajaxHTML = ""; 
ajaxHTML += "<template>\n"; 
ajaxHTML += " <div>asdf</div>\n"; 
ajaxHTML += " <div>\n"; 
ajaxHTML += "  <span>asdf</span>\n"; 
ajaxHTML += " </div>\n"; 
ajaxHTML += "</template>"; 


// Gives the <template> 
console.log(withoutJquery(ajaxHTML)); 
console.log(withJquery(ajaxHTML)); 

// Where are the <div>'s? 
console.log(withoutJquery(ajaxHTML).childNodes.length); 
console.log(withJquery(ajaxHTML).childNodes.length); 

Answer 1

대신 fragment.firstChild의 fragment.firstChild.content을 돌아보십시오.

이 브라우저에 의해 다소 차이가 나타납니다 때문에, 더 나은 솔루션은 다음과 같이 될 것이다 :

var toReturn = fragment.firstChild; 
return (toReturn.content ? toReturn.content : toReturn.childNodes); 

childNodes뿐만 아니라 필요 여부에 대한 브라우저에 의해 약간의 혼동이있을 것 같습니다 - 위의 코드와 함께 , console.log() 문에서 childNodes을 제거 할 수 있습니다.