Как вставить динамический тег JavaScript в iframe - PullRequest
4 голосов
/ 03 февраля 2012

ЗАКЛЮЧИТЕЛЬНОЕ ОБНОВЛЕНИЕ: работает второй блок кода - я просто пропустил URL.

Я пытаюсь поместить динамически созданный скрипт в iframe. Я могу получить доступ к заголовку iframe, но, похоже, он не принимает запрос на добавление. Вызов журнала консоли возвращает тег head, и следующее добавление текста в тело работает нормально. Я также попытался добавить тег script к телу. (примечание: тег script находится не в том же домене, поэтому я избегал использования getScript или ajax).

$(document).ready(function() {
  $('<iframe></iframe>', {
      name:"contentFrame"
      ,id:"contentFrame"
  }).css("height", 300).css("width", 500).load(function() {
      var script   = document.createElement("script");
      script.type  = "text/javascript";
      script.src   = "//cross-domain.com/script.js";
      console.log($(this).contents().find("head")); // outputs: [<head></head>]
      $(this).contents().find("head").append(script); // doesn't work
      $(this).contents().find("body").append(script); // doesn't work
      $(this).contents().find("body").append("Test"); // works
  }).appendTo("#content");
});

Вот новая версия, которая успешно добавляет скрипт на основе приведенного ниже предложения, но скрипт не оценивает (как проверено простым предупреждением). Плюс еще одна странность: значок «работает» отображается в течение 15 секунд, а состояние (в chrome) гласит «получение ...». В конце концов, оно останавливается, но ничего не происходит.

    $(document).ready(function() {
  $('<iframe></iframe>', {
      name:"contentFrame"
      ,id:"contentFrame"
  }).css("height", 300).css("width", 500).load(function() {
      var script   = document.createElement("script");
      script.type  = "text/javascript";
      script.src   = "//cross-domain.com/script.js";
      console.log($(this).contents().find("head"));
      $(this).contents().find("head")[0].appendChild(script);
      $(this).contents().find("body").append("Test");
  }).appendTo("#content");
});

Обновление: когда иконка курсора наконец-то перестает работать (около 10 секунд, что странно, потому что это локальный сервер с одной строкой кода), я получаю это сообщение в консоли Chrome (оно красным с красным кружком) Значок X рядом с ним):

GET http://cross-domain.com/script.js 
(anonymous function)temp.html:16
jQuery.event.dispatchjquery-1.7.1.js:3261
jQuery.event.add.elemData.handle.eventHandlejquery-1.7.1.js:2880
jQuery.fn.extend.appendjquery-1.7.1.js:5771
jQuery.fn.extend.domManipjquery-1.7.1.js:5973
jQuery.fn.extend.appendjquery-1.7.1.js:5769
jQuery.each.jQuery.fn.(anonymous function)jquery-1.7.1.js:6162
(anonymous function)temp.html:18
jQuery.Callbacks.firejquery-1.7.1.js:1049
jQuery.Callbacks.self.fireWithjquery-1.7.1.js:1167
jQuery.extend.readyjquery-1.7.1.js:435
DOMContentLoaded

Ответы [ 2 ]

2 голосов
/ 03 февраля 2012

См. Этот ответ https://stackoverflow.com/a/3603496/220299

Возможно, он действительно работает, но тег сценария просто не виден.

0 голосов
/ 03 февраля 2012

Попробуйте это.

$(document).ready(function() {
  $('<iframe></iframe>', {
      name:"contentFrame"
      ,id:"contentFrame"
  }).css("height", 300).css("width", 500).load(function() {
      $(this).contents().find("head").append('<scr' + 'ipt type="text/javascript" src="//cross-domain.com/script.js"></scr' + 'ipt>');
  }).appendTo("#content");
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...