JavaScript에서 새 요소를 어떻게 추가 할 수 있습니까?

Question

저는 누군가의 페이지에 붙여서 iFrame을 만들 수있는 JavaScript 스크립트를 만들었습니다. 필자는 iFrame을 표시 할 스크립트를 붙여 넣을 수있는 사람이 필요합니다.

그러나 DOM을 만든 iFrame을 스크립트를 붙여 넣은 위치에 추가하는 방법을 알 수 없습니다. 그것은 항상 몸의 맨 아래에 덧붙입니다.

어떻게 추가합니까?

Answer 1

mm. 당신 수 수행

document.write("<div id='iframecontainer'></div>"); 
document.getElementById('iframecontainer').innerHTML = '...'; 

하지만 그건 추한 느낌/다른 수준의 많은 잘못. 하지만 나는 다른 대안을 모르고있다.

편집 : 사실, 빠른 구글 검색 document.write이 못생긴 이유에 대해 설명하는 this artlcle을 밝혀 당신이있어 특정 피클을위한 좋은 대안 : 당신의 script 태그에게 ID를 줘!

<script id="iframeinserter" src=".."></script> 

그리고 당신은 스크립트 태그에 대한 참조를 얻고 그 전에 iframe을 삽입 할 수 있습니다 : 사용자가 iframe이 있어야 할 곳에있을 것이다 요소의 ID를 줄 수있는 경우

var newcontent = document.createElement('iframe'); 
var scr = document.getElementById('iframeinserter'); 
scr.parentNode.insertBefore(newcontent, scr); 

Answer 2

을 , 그러면 CSS를 사용하여 iframe을 페이지의 어느 위치로 옮길 수 있습니다.

Answer 3

Paulo의 답변은 ID 없이도 마지막으로 < script> 요소를 찾는 것만으로도 가능합니다. 이는 온로드에 넣을 수

var scripts= document.getElementsByTagName('script'); 
var script= scripts[scripts.length-1]; 
script.parentNode.insertBefore(d, script); 

/준비 : 자바 스크립트는 아직 분석되지 않은 현재 스크립트 블록의 종료 태그 과거의 모든 컨텐츠 (*)를 보장하기 때문에, 우리가하고있는 스크립트 블록이어야합니다 함수를 사용하고 싶다면 'var script'를 포함 시간에 계산해야하며 준비 함수가 아닌 경우 (실행하면 더 많은 스크립트가 파싱됩니다).

(* : < 스크립트 지연의 경우 제외)