Question

我尝试阅读信息，却发现自己迷失了。

有没有办法使用javascript创建和删除iframe？

待办事项：在按钮上点击创建并删除iframe 10次，但我不明白如何关闭iframe。

Js fiddle https://jsfiddle.net/fp87vb9j/1/

<html>
<body>
<button type="button" onclick="removeIFrame()">Click Me!</button>
  <div class="top" onclick="removeIFrame();"></div>
  <iframe id="iframe" src="www.google.com" width="200" height="100"></iframe>
  <div class="top"></div>
</body>
<script type="text/javascript">
    function removeIFrame() {
var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].parentNode.removeChild(iframes[i]);
}
}
</script>
</html>

我现在看到了它，我忘了最后，现在它正在工作。有没有办法重新创建iframe？

编辑2：https://jsfiddle.net/fp87vb9j/2/

<html>
<body>
<button type="button" onclick="removeIFrame()">Click Me!</button>
  <div class="top" onclick="removeIFrame();"></div>
  <iframe id="iframe" src="www.google.com" width="200" height="100"></iframe>
  <div class="top"></div>
</body>
<script type="text/javascript">
    function removeIFrame() {
var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < 10; i++) {
var ifrm[i] = document.createElement("iframe");
        ifrm[i].setAttribute("src", "http://google.com/");
        ifrm[i].style.width = "640px";
        ifrm[i].style.height = "480px";
        document.body.appendChild(ifrm[i]);
        setInterval(div_show, 5 * 1000);
    iframes[i].parentNode.removeChild(iframes[i]);
}
}
</script>
</html>

新问题：未捕获的ReferenceError：未定义createIFrames

<html>
<body>
<button type="button" onclick="removeIFrame()">Click Me!</button>
<button type="button" onclick="createIFrames()">Create iframe!</button>
  <div class="top" onclick="removeIFrame();"></div>

  <iframe id="iframe" src="www.google.com" width="200" height="100"></iframe>
  <div class="top"></div>
</body>
<script type="text/javascript">
    function removeIFrame() {
var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].parentNode.removeChild(iframes[i]);
}
}
</script>
<script type="text/javascript">
    function createIFrames() {
var ifrm = document.createElement("iframe");
        ifrm.setAttribute("src", "http://hello.com/");
        ifrm.style.width = "640px";
        ifrm.style.height = "480px";
        document.body.appendChild(ifrm);

}
}
</script>
</html>

Answer 1

你可以试试这个：

首先在HTML中创建和iframe，然后创建一个删除按钮，并在删除按钮的操作上，这将用于从您的网页删除iframe

var iframes = document.querySelectorAll('iframe');
for (var i = 0; i < iframes.length; i++) {
    iframes[i].parentNode.removeChild(iframes[i]);
}

Answer 2

希望这会有所帮助。您可以在下面的代码中找到评论。基本上，需要等到使用Java/SpringFramework-based事件加载所有iframe，然后逐个删除每个iframe。

onload

Javascript创建和删除iframe

2 个答案: