자바스크립트에서 insertBefore를 사용하는 방법

JavaScript에서 insertBefore() 메서드는 DOM 트리에 새 노드를 삽입하는 데 사용됩니다. 이 방법에는 삽입할 새 노드와 참조 노드(즉, 새 노드가 삽입될 노드)라는 두 가지 매개 변수가 필요합니다.

다음은 insertBefore() 메서드를 사용하는 기본 예입니다.

// 获取要插入新节点的父节点  
var parentElement = document.getElementById('parent');  
  
// 创建新的元素节点  
var newElement = document.createElement('div');  
newElement.innerHTML = 'This is the new element';  
  
// 使用insertBefore方法插入新元素  
var referenceElement = parentElement.firstChild;  // 参考节点为父节点的第一个子节点  
parentElement.insertBefore(newElement, referenceElement);

이 예에서는 먼저 상위 요소에 대한 참조를 얻습니다(이 경우 ID는 'parent'입니다). . 그런 다음 새 div 요소를 만들고 여기에 텍스트 콘텐츠를 추가했습니다. 마지막으로 insertBefore() 메서드를 사용하여 상위 요소의 첫 번째 하위 요소 앞에 새 요소를 삽입합니다.

insertBefore() 메서드는 DOM 트리의 구조를 변경합니다. 원래 DOM 구조를 변경하고 싶지 않은 경우,appendChild() 또는 insertBefore() 메서드를 사용하여 새 노드를 추가하는 것을 고려할 수 있습니다.

위 내용은 자바스크립트에서 insertBefore를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!