실행 중 AJAX를 통해 삽입된 요소</strong></p> <p>특정 시나리오에서는 AJAX 호출이 <script> 태그. 그러나 이러한 태그 내의 스크립트 코드는 DOM에 삽입된 후 실행되지 않을 수 있습니다.</p> <p><strong>문제 설명:</strong></p> <p>다음 HTML 구조를 고려하세요.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre><div></pre><div class="contentsignin">로그인 후 복사</div></div><div class="contentsignin">로그인 후 복사</div></div> <p>"콘텐츠" div를 PHP 파일의 데이터로 채우라는 AJAX 요청이 이루어졌습니다. PHP 응답에 다음 코드가 포함되어 있다고 가정합니다.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><div class="code" style="position:relative; padding:0px; margin:0px;"><pre><div></pre><div class="contentsignin">로그인 후 복사</div></div><div class="contentsignin">로그인 후 복사</div></div> <p>AJAX 요청이 완료된 후 삽입된 <script> 삽입 시 DOM에 대한 액세스가 부족하여 태그가 실행되지 않을 수 있습니다.</p> <p><strong>해결책:</strong></p> <p>삽입된 <script> 코드에서 다음 JavaScript 기술을 활용할 수 있습니다.</p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre>var arr = MyDiv.getElementsByTagName('script'); for (var n = 0; n < arr.length; n++) eval(arr[n].innerHTML);//run script inside div</pre><div class="contentsignin">로그인 후 복사</div></div> <p>이 코드는 모든 <script> 지정된 div 내의 요소를 분석하고 innerHTML을 평가하여 포함된 코드를 효과적으로 실행합니다.</p>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
