일상적인 프런트엔드 개발에서는 때때로 JavaScript 코드를 동적으로 삽입해야 하는 경우가 있습니다. 1. 스크립트 태그를 동적으로 생성하고 해당 태그의 src 속성, type 속성 등을 설정합니다. 2, 페이지에 스크립트 노드를 삽입하고 js 파일을 로드합니다. 이는 를 추가하는 것과 같습니다. 이 프로세스는 동적으로 완료되며 이 목적을 위해 특별히 함수가 캡슐화됩니다. <br></p> <div class="codetitle"> <span><a style="CURSOR: pointer" data="78712" class="copybut" id="copybut78712" onclick="doCopy('code78712')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다: </div> <div class="codebody" id="code78712"> <br>// 스크립트 태그를 동적으로 삽입 <br>function createScript(url, callback){ <br>var oScript = document.createElement('script') <br>oScript .type = 'text/javascript'; <br>oScript.async = true; <br>oScript.src = url; <br>/* <br>** 스크립트 태그의 onload 및 onreadystatechange 이벤트<br>** IE6 /7/8은 onreadystatechange 이벤트를 지원합니다<br>** IE9/10은 onreadystatechange 및 onload 이벤트를 지원합니다<br>** Firefox/Chrome/Opera는 onload 이벤트를 지원합니다<br>*/ <br><br>// IE8 이하 결정 브라우저<br>var isIE = ! -[1,]; <br>if(isIE){ <br>alert('IE') <br>oScript.onreadystatechange = function(){ <br>if(this.readyState == '로드됨' || this .readyState == '완료'){ <br>callback(); <br>} <br>} <br>} else { <br>// IE9 이상 브라우저, Firefox Chrome, Opera <br>oScript .onload = function(){ <br>callback(); <br>} <br>} <br>document.body.appendChild(oScript) <br><br> </div>다음과 같이 사용: <br><br><div class="codetitle"><span><a style="CURSOR: pointer" data="70426" class="copybut" id="copybut70426" onclick="doCopy('code70426')">코드 복사 <u></u></a> 코드는 다음과 같습니다. </span></div> <div class="codebody" id="code70426">createScript ('xxx.js', function() { <br>console.log('OK'); <br>});</div>