Почему добавление <script> к динамически созданному <iframe> похоже запускает скрипт на родительской странице?

Я пытаюсь создать <IFRAME> с помощью JavaScript, а затем присоединять < сценарий > элемент к этому <IFRAME>, что я хочу работать в контексте <IFrame> г документа.Почему добавление <script> к динамически созданному <iframe> похоже запускает скрипт на родительской странице?

К сожалению, кажется, что я делаю что-то неправильно - мой JavaScript, кажется, успешно выполнить, но контекст < сценария > является родительской страницы, не <IFrame> d документ. Я также получаю 301 Ошибка в «Net» вкладке Firebug, когда браузер запрашивает iframe_test.js, хотя он затем запрашивает его снова (не уверен, почему?) Успешно.

Это код, я использую (демо на http://onespot.wsj.com/static/iframe_test.html):

iframe_test.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <title>&lt;iframe&gt; test</title> 
    </head> 
    <body> 
    <div id="bucket"></div> 
    <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
     $('#bucket').append('<iframe id="test"></iframe>'); 
     setTimeout(function() { 
      var iframe_body = $('#test').contents().find('body'); 
      iframe_body.append('<scr' + 'ipt type="text/javascript" src="http://onespot.wsj.com/static/iframe_test.js"></scr' + 'ipt>'); 
     }, 100); 
     }); 
    </script> 
    </body> 
</html>

iframe_test.js

$(function() { 
    var test = '<p>Shouldn\'t this be inside the &lt;iframe&gt;?</p>'; 
    $('body').append(test); 
});

Одна вещь, которая кажется необычным, что код в iframe_test.js даже работает; Я не загрузил jQuery в <iframe> сам, только в родительском документе. Это кажется мне ключом, но я не могу понять, что это значит.

Любые идеи, предложения и т. Д. Были бы высоко оценены!

источник

2009-10-19 Bungle

Возможно, это связано с тем, что сам элемент

Я не нашел ответа на свой первоначальный вопрос, но нашел другой подход, который работает еще лучше (по крайней мере, для моих целей).

Это не использует jQuery на родительской странице (что на самом деле хорошо, так как я бы предпочел не загружать его там), но он загружает jQuery в <iframe> в явно полностью действительном и полезный способ. Все, что я делаю, это писать над документом <iframe> с новым, созданным с нуля. Это позволяет мне просто включить в строку строку < сценарий >, который затем я записываю в объект документа iframe >.

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
    <title>frame</title> 
    </head> 
    <body> 

    <div id="test"></div> 

    <script type="text/javascript"> 
     // create a new <iframe> element 
     var iframe = document.createElement('iframe'); 

     // append the new element to the <div id="bucket"></div> 
     var bucket = document.getElementById('test'); 
     bucket.appendChild(iframe); 

     // create a string to use as a new document object 
     var val = '<scr' + 'ipt type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></scr' + 'ipt>'; 
     val += '<scr' + 'ipt type="text/javascript"> $(function() { $("body").append("<h1>It works!</h1>"); }); </scr' + 'ipt>'; 

     // get a handle on the <iframe>d document (in a cross-browser way) 
     var doc = iframe.contentWindow || iframe.contentDocument; 
     if (doc.document) { 
     doc = doc.document; 
     } 

     // open, write content to, and close the document 
     doc.open(); 
     doc.write(val); 
     doc.close(); 
    </script> 

    </body> 
</html>

Я надеюсь, что это помогает кто-то вниз по дороге!

источник

2009-10-19 22:09:12 Bungle

Это именно то, что я ищу. Есть ли способ использовать APPEND для iframe, чтобы содержимое тела не стиралось? – AnApprentice

Зачем писать '' user2284570

@ user2284570: Браузеры будут интерпретировать любые строки HTML внутри встроенных '';' будет интерпретироваться как преждевременный закрывающий тег для текущего скрипта, что приведет к синтаксической ошибке. – Bungle

Ответ на исходный вопрос прост - выполнение скрипта выполняется с помощью jquery, и поскольку jquery загружается в верхний фрейм, здесь также запускается скрипт, независимо от того, где вы его добавляете.Разумная реализация jquery, без сомнения, может быть использована для использования правильного объекта окна, но на данный момент все так и есть.

Что касается обходных решений, у вас уже есть два хороших ответа (даже если вы сами). Я могу добавить, что вы можете использовать одно из этих обходных решений, чтобы включить jquery.js в iframe, а затем получить этот объект jquery вместо верхнего, чтобы вставить дополнительную разметку ... но это тоже может быть слишком велико.

источник

2013-02-25 14:55:07 user2107721

false: https://jsfiddle.net/vohn8w80/ –

Почему добавление <script> к динамически созданному <iframe> похоже запускает скрипт на родительской странице?

Смежные вопросы