다음은 몇 가지 샘플 코드입니다.
function addTextNode(){
var newtext = document.createTextNode(" Some text added dynamically. ");
var para = document.getElementById("p1");
para.appendChild(newtext);
$("#p1").append("HI");
}
<div style="border: 1px solid red">
<p id="p1">First line of paragraph.<br /></p>
</div>
append()
과 의 차이점은 무엇입니까 appendChild()
?
실시간 시나리오가 있습니까?
답변
주요 차이점은 appendChild
DOM 메서드이고 append
jQuery 메서드라는 것입니다. 두 번째는 jQuery 소스 코드에서 볼 수 있듯이 첫 번째를 사용합니다.
append: function() {
return this.domManip(arguments, true, function( elem ) {
if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
this.appendChild( elem );
}
});
},
프로젝트에서 jQuery 라이브러리를 사용하는 append
경우 페이지에 요소를 추가 할 때 항상 안전하게 사용할 수 있습니다 .
답변
더이상
이제 append는 JavaScript의 메소드입니다.
MDN 인용
이
ParentNode.append
메서드DOMString
는의 마지막 자식 뒤에 Node 개체 또는 개체 집합을 삽입 합니다ParentNode
.DOMString
객체는 동등한 Text 노드로 삽입됩니다.
IE 및 Edge에서는 지원되지 않지만 Chrome (54+), Firefox (49+) 및 Opera (39+)에서는 지원됩니다.
JavaScript의 추가는 jQuery의 추가와 유사합니다.
여러 인수를 전달할 수 있습니다.
var elm = document.getElementById('div1');
elm.append(document.createElement('p'),document.createElement('span'),document.createElement('div'));
console.log(elm.innerHTML);
<div id="div1"></div>
답변
append
요소에 일부 콘텐츠 또는 HTML을 추가하는 jQuery 메서드입니다.
$('#example').append('Some text or HTML');
appendChild
자식 요소를 추가하기위한 순수한 DOM 메서드입니다.
document.getElementById('example').appendChild(newElement);
답변
나는 이것이 오래되고 대답 된 질문이라는 것을 알고 있으며 나는 투표를 찾고 있지 않습니다. 나는 새로운 이민자들에게 도움이 될 것이라고 생각하는 작은 것을 추가하고 싶습니다.
예 appendChild
는 DOM
방법이고 append
JQuery 방법이지만 실제로 중요한 차이점은 appendChild
노드를 매개 변수로 사용한다는 것입니다. 즉, DOM에 빈 단락을 추가하려면 해당 p
요소를 먼저 만들어야합니다.
var p = document.createElement('p')
그런 다음 DOM에 추가 할 수 있지만 JQuery는 append
해당 노드를 생성하여 텍스트 요소 든 html 요소 든 조합이든 즉시 DOM에 추가합니다!
$('p').append('<span> I have been appended </span>');
답변
답변
appendChild
순수한입니다 자바 스크립트 와 같은 방법 append
A는 의 jQuery 방법은.
답변
자바 스크립트에 appendChild의 방법은 다른 요소에 항목을 추가하는 사용 될 수 있습니다. jQuery를 추가]의 요소는 동일한 작업을하지만 확실히 선 적은 수의 작업을 수행합니다
목록에 항목을 추가하는 예제를 살펴 보겠습니다.
a) JavaScript 사용
var n= document.createElement("LI"); // Create a <li> node
var tn = document.createTextNode("JavaScript"); // Create a text node
n.appendChild(tn); // Append the text to <li>
document.getElementById("myList").appendChild(n);
b) jQuery 사용
$("#myList").append("<li>jQuery</li>")