Question

我正在使用具有src =“”的javascript创建iframe元素，因为我不想从网址加载html。我想使用javascript更改iframe的html。我的iframe元素是

window.onload = function () {
    var html = '';
    html += '<div id="myModal" class="modal fade"><div class="modal-dialog"><div class="modal-content"><div class="modal-header">';
    html += '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button><h4 class="modal-title">Preview</h4></div>';
    html += '<div class="modal-body" style="height:450px; width:100%; margin-top: -17px; margin-left: -17px;">';
    html += '<iframe id="myiframe" src="" onload="editContent();" width="100%" height="100%" style="position:fixed;border-width: 0;" allowtransparency="true">';
    html += '</iframe></div></div></div></div>';
    document.body.innerHTML += html;

    var iframe = document.getElementById('myiframe'),
        iframedoc = iframe.contentDocument || iframe.contentWindow.document;
    iframedoc.body.innerHTML = '<h1>Test h1</h1><h2>Test h2</h2><h3>Test h3</h3><h4>Test h4</h4><h5>Test h5</h5><h6>Test h6</h6>';
}

但它不会在iframe中添加内容，如果我在控制台中查看，iframe仍然是空的。有什么错误..？

Answer 1

我找到了问题的解决方案，我试图在iframe正确创建之前添加html数据。所以我使用了settimeout（）并编写了我的js代码来添加内部html。所以现在工作正常。

setTimeout(function () {
    var iframe = document.getElementById('myiframe'),
        iframedoc = iframe.contentDocument || iframe.contentWindow.document;
    iframedoc.body.innerHTML = '<h1>Test h1</h1><h2>Test h2</h2><h3>Test h3</h3><h4>Test h4</h4><h5>Test h5</h5><h6>Test h6</h6>';
},500);

如何在iframe中添加动态内容..？

1 个答案: