Javascript appendChild не отображается в DOM - PullRequest
0 голосов
/ 07 августа 2020

У меня есть требование вставить тег изображения в iframe. Когда я отлаживаю код, я вижу добавленное html в объекте. Но он не отображается в DOM, и я не вижу его на странице. Это фрагмент для справки.

var tdForImage = iframewindow.document.getElementsByTagName("table")[1].getElementsByTagName('tr')[0].getElementsByTagName('td')[0];
var imgTag = document.createElement("img");

//copying img src value from elsewhere
imgTag.src = iframewindow.document.getElementsByTagName("img")[0].src;

//Remove the wrongly placed second image.
iframewindow.document.getElementsByTagName("img")[0].parentNode.removeChild(iframewindow.document.getElementsByTagName("img")[0]);
tdForImage.appendChild(imgTag);

После этого я вижу, что в пользовательском интерфейсе нет изменений. ПУСТОЙ iframe. В его документе нет ничего ни в голове, ни в теле. Во время отладки я вижу img внутри внутреннего HTML attr в tdForImage. Почему очищается iframe? Если у кого-то есть опыт решения таких проблем, пожалуйста, сообщите ..

EDIT 1 >> Я заметил, что на IE 11 скрипт, добавленный в тег заголовка iframes, не загружается, когда страница загружается для первый раз. Похоже, это root причина проблемы. Я уже пробовал добавить таймаут в 2 секунды. Я уже пробовал загрузить скрипт, содержащий функцию, как внутреннюю HTML. Оба не работают. Если кто-нибудь знает способ заставить IE загружать скрипты сразу после вызова appendChild, дайте мне знать ..

1 Ответ

0 голосов
/ 11 августа 2020

У меня работает на JSFiddle:

<iframe id="frame" src="about:blank"></iframe>
// Fill iframe for demo
document.getElementById('frame').contentWindow.document.write('<table><tr><td>fdsafdsa</td></tr></table><img src="https://placekitten.com/200/300" />');

var iframe = document.getElementById('frame');

var iframewindow = iframe.contentDocument || iframe.contentDocument.document;
console.log(iframewindow.toString());

var tdForImage = iframewindow.getElementsByTagName("table")[0].getElementsByTagName('tr')[0].getElementsByTagName('td')[0];
var imgTag = document.createElement("img");

imgTag.src = iframewindow.getElementsByTagName("img")[0].src;
iframewindow.getElementsByTagName("img")[0].parentNode.removeChild(iframewindow.getElementsByTagName("img")[0]);

tdForImage.appendChild(imgTag);

https://jsfiddle.net/r6o83gL5/12/

Но если ваш iframe находится в другом домене, вы не будете получить доступ к его телу.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...