Как создать тег внутри тега через событие onload или еще как то
<div id="video" onload=""></div>
Нужно чтобы динамически создался iframe внутри тега, как пример ниже
<div id="video" onload="">
<iframe width="390" height="324" src="https://www.youtube.com/embed/xxxxxxxx?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen=""></iframe>
</div>
Ответы (2 шт):
Не знаю, правильно ли я вас понял, но есть несколько вариантов, покажу самый простой:
В html-файле оставляем див, подключаем js файл, и в нём пишем:
const iframe = `<iframe width="390" height="324" src="https://www.youtube.com/embed/xxxxxxxx?rel=0&controls=0&showinfo=0" frameborder="0"></iframe>`;
const video = document.getElementById("video");
video.insertAdjacentHTML('beforeend', iframe);
Быстро поясню что делает весь этот код. Сначала мы в переменную записываем html код, который вставится куда нам нужно, в переменной video мы ищём элемент с айди "video", после чего в insertAdjacentHtml добавляем iframe в основной код. Собственно, один из простых способов создать тег.
Также оставлю ссылки на документацию, измение документа, более подробно про insertAdjacentHtml
Для вас самый короткий способ вставить кусок разметки, но так редко поступают:
const iframeStr = '<iframe width="390" height="324" src="https://www.youtube.com/embed/xxxxxxxx?rel=0&controls=0&showinfo=0" frameborder="0" allowfullscreen=""></iframe>';
const videoElem = document.getElementById('video');
const renderIframe = () => {
videoElem.innerHTML = iframeStr;
};
window.onload = renderIframe;