비동기 스크립트 로드 후 문서 쓰기 실행 실패를 처리하는 방법은 무엇입니까?

비동기 스크립트 로딩 후 문서 쓰기 실행 실패

비동기 스크립트 로딩 시, 로딩된 스크립트는 문서가 완전히 파싱된 후 실행되며, 닫은. 이러한 제한으로 인해 로드된 스크립트 내에서 document.write()를 사용할 수 없습니다.

오류 이유

오류 메시지 "쓰기가 불가능합니다. 비동기적으로 로드된 외부 스크립트에서 문서로'라는 메시지는 문서가 닫힌 후 스크립트가 로드되었기 때문에 document.write()를 사용하여 문서에 쓰려는 시도가 실패했음을 나타냅니다.

대체 DOM 조작

이 문제를 해결하려면 document.write() 문을 명시적인 DOM 조작으로 바꿔야 합니다. 여기에는 DOM 요소를 생성하고 다음과 같은 메서드를 사용하여 이를 상위 요소에 삽입하는 작업이 포함됩니다.

• .appendChild()
• .insertBefore()
• .innerHTML

예

예를 들어 인라인 스크립트에서 document.write()를 사용하는 대신 다음과 같이 사용합니다.

<code class="html"><div id="container">
<script>
document.write('<span style="color:red;">Hello</span>');
</script>
</div></code>

동적으로 로드된 스크립트의 다음 코드:

<code class="javascript">var container = document.getElementById("container");
var content = document.createElement("span");
content.style.color = "red";
content.innerHTML = "Hello";
container.appendChild(content);</code>

또는 컨테이너의 innerHTML을 설정할 수 있습니다.

<code class="javascript">var container = document.getElementById("container");
container.innerHTML = '<span style="color:red;">Hello</span>';</code>

document.write() 문을 이러한 대체 DOM 조작으로 대체 기술을 사용하면 원하는 문서 수정을 달성하는 동시에 비동기적으로 로드된 스크립트를 성공적으로 실행할 수 있습니다.

위 내용은 비동기 스크립트 로드 후 문서 쓰기 실행 실패를 처리하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!