JavaScript로 DOM 요소 내부 교체

DOM에서 요소 교체는 웹 개발에 유용한 기술이 될 수 있습니다. 예를 들어, 앵커() 요소를 범위() 요소로 교체하려는 경우 JavaScript를 사용하여 교체할 수 있습니다.

DOM을 교체하는 가장 효과적인 접근 방식 요소가 제자리에 있으면 replacementChild() 메서드를 활용하는 것입니다. 이를 구현하는 방법은 다음과 같습니다.

1. DOM 요소에 대한 참조를 얻습니다.

   var myAnchor = document.getElementById("myAnchor");
   var mySpan = document.createElement("span");

2. 새 요소의 콘텐츠 수정:

   mySpan.innerHTML = "replaced anchor!";

3. parentNode의 요소를 사용하여 원래 요소를 새 요소로 교체합니다. replacementChild() 메서드:

   myAnchor.parentNode.replaceChild(mySpan, myAnchor);

이 프로세스는 앵커() 요소를 원활하게 대체합니다. 스팬() 요소를 사용하여 DOM에서 요소의 위치를 ​​유지합니다.