외부 스크립트 태그 내의 JavaScript: 소스 딜레마 구문의 한계를 이해하는 것이 중요합니다. 아래 예와 같이 이러한 태그 내에 JavaScript를 직접 삽입하려고 하면 예기치 않은 동작이 발생합니다.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre><code class="html"><script src="myFile.js"> alert("This is a test"); 로그인 후 복사 외부 스크립트 태그는 지정된 소스에서 JavaScript 코드를 로드하도록 설계되었기 때문에 이 코드는 작동하지 않습니다. JavaScript의 인라인 실행을 허용하지 않습니다. 이 문제를 해결하려면 추가 페이지 자체에서 실행하려는 JavaScript 코드에 대한 태그:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre><code class="html"><script> alert("This is a test"); 로그인 후 복사 다음 예는 이 문제가 발생할 수 있는 일반적인 시나리오를 보여줍니다. addScript("script/obj.js"); addScript("script/home/login.js"); 로그인 후 복사 여기서 다음을 시도합니다. 외부 파일의 addScript 함수를 사용하여 DOM에 여러 스크립트를 추가하려고 시도했지만 이 접근 방식은 실패했습니다. addScript 함수를 실행하고 스크립트를 동적으로 로드하려면 인라인 태그:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre><code class="html"><script> addScript("script/obj.js"); addScript("script/home/login.js"); 로그인 후 복사 이 동작의 이유는 외부 스크립트 태그가 한 번에 하나의 스크립트를 로드하기 때문입니다. 동일한 에 인라인 스크립트와 외부 스크립트를 모두 포함하려고 합니다. 태그를 사용하면 인라인 스크립트가 무시됩니다. 한 페이지에서 여러 스크립트를 실행하려면 별도의 <script> </p> <p>인라인 <script> 태그는 외부 스크립트와 함께 사용될 때 무시됩니다. data-*와 같은 속성을 사용하여 이러한 태그에 데이터를 저장할 수 있습니다. 이 접근 방식은 특정 시나리오에 유리할 수 있지만 일반적으로 data-* 속성을 사용하는 것이 더 깔끔한 솔루션으로 간주됩니다.</p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
