JAVASCRIPT:用新的iframe替换iframe，如果不存在，则制作新的

Question

我需要根据用户输入替换iframe-src。如果有的话，我需要一些，但不确定如何处理vars——我不知道。这是迄今为止的一个代码：

<div>

<h3>Some Header</h3>

<input type="text" size="25" id="inputTxt" value="">
<button onclick="myFunc()">go</button>
<br>
<br>
<div id="myDiv"></div>
<script>
function myFunc() {
var word = document.getElementById("inputTxt").value;
//if iframe (iframeClass) exists - replace with new one - else make new one...
var someNewFrame = document.createElement("iframe");
someNewFrame.setAttribute("class", "iframeClass");
someNewFrame.setAttribute("src", "http://someones.com/next/staters/" + word );
var newFrame = document.getElementById("myDiv");
newFrame.appendChild(someNewFrame); 
}
</script>

</div>

Answer 1

您可以删除div中的内容。通过newFrame.removeChild(newFrame.lastChild);删除最后一个子项，您已经清除了div。之后，您可以轻松添加新的iframe

function myFunc() {
var word = document.getElementById("inputTxt").value;
//if iframe (iframeClass) exists - replace with new one - else make new one...
var someNewFrame = document.createElement("iframe");
someNewFrame.setAttribute("class", "iframeClass");
someNewFrame.setAttribute("src", "http://someones.com/next/staters/" + word );
var newFrame = document.getElementById("myDiv");
// remove the last child
if(newFrame.lastChild!==null)
newFrame.removeChild(newFrame.lastChild);
newFrame.appendChild(someNewFrame); 
}

<div>

<h3>Some Header</h3>

<input type="text" size="25" id="inputTxt" value="">
<button onclick="myFunc()">go</button>
<br>
<br>
<div id="myDiv"></div>