모든 곳에 insertAdjacentHTML

HTML 문서에 콘텐츠를 삽입하려는 경우 다음 세 가지 방법이 있습니다.

몇 가지 사용 사례에도 document.write가 있다고 할 수 있습니다.

innerHTML는 HTML5에서 표준화되었으며, innerHTML로 작동하는 형제 메서드 insertAdjacentHTML을 사용합니다. 하지만 이를 사용하면 HTML 콘텐츠를 삽입할 위치를 더 구체적으로 정의할 수 있습니다(beforeBegin, afterBegin, beforeEnd, afterEnd).

var ul = document.getElementById("list");
ul.insertAdjacentHTML("beforeEnd", "<li>A new li on the list.</li>");

2008년 John Resig는 다음과 같은 결론과 함께 insertAdjacentHTML에 대한 기사를 작성했습니다.

지금까지 insertAdjacentHTML의 주요 문제는 브라우저를 지원하지 않았습니다. Firefox 버전 8부터 insertAdjacentHTML을 구현하면 모바일 브라우저를 비롯한 모든 주요 브라우저에서 사용할 수 있습니다. 지금 사용하고자 하며 Firefox 8 이전 버전에서 작동하도록 하려면 이 polyfill을 사용하면 됩니다.