마크 업 문자열에서 노드 만들기

Question

JavaScript에서 마크 업 문자열을 노드 객체로 변환하는 방법이 있습니까? 사실은 내가위한 subsitute가 찾고 있어요 :

document.getElementById("divOne").innerHTML += "<table><tbody><tr><td><input type='text' value='0' /></td></tr></tbody></table>" 

뭔가 다음 각각의 속성과 값을 연결 한 후 그 자식 요소를 추가 테이블 요소를 생성하지 않고 createNodeFromString 사용

document.getElementById("divOne").appendChild(document.createNodeFromString("<table><tbody><tr><td><input type='text' value='0' /></td></tr></tbody></table>")) 

처럼!

Answer 1

여기에는 기존의 교차 브라우저 기능이 없습니다.

function appendStringAsNodes(element, html) { 
    var frag = document.createDocumentFragment(), 
     tmp = document.createElement('body'), child; 
    tmp.innerHTML = html; 
    // Append elements in a loop to a DocumentFragment, so that the browser does 
    // not re-render the document for each node 
    while (child = tmp.firstChild) { 
     frag.appendChild(child); 
    } 
    element.appendChild(frag); // Now, append all elements at once 
    frag = tmp = null; 
} 

사용 (읽기 쉽도록 들여 쓰기) : 다음 방법은 원하는 (this answer을 기반으로 최적의 성능을 위해 DocumentFragment를 사용) 효과를 얻을 수 있습니다

appendStringAsNodes(
    document.getElementById("divOne"), 
    "<table><tbody><tr><td><input type='text' value='0' /></td></tr></tbody></table>" 
); 

Answer 2

예, 할 수 있습니다 그렇게.

var myNewTable = document.createElement("table"); 
myNewTable.innerHTML = "<tbody><tr><td><input type='text' value='0' /></td></tr></tbody>" 
document.getElementById("divOne").appendChild(myNewTable);