如何将IFRAME移动到DIV中？

有一个HTML内容，用户可以自由编辑。那好，但我必须将所有IFRAME移动到DIV中。我试着这个：如何将IFRAME移动到DIV中？

$('#rolunk_content iframe').html ('<div>1' + $('#rolunk_content iframe').html() + '2</div>');

但这没有效果。

编辑：小提琴：http://jsfiddle.net/nE3jG/

来源

2014-02-28 John Smith

你可以在HTML中编写一些示例代码吗？ – naota

那是因为你的代码试图设置iframe，这显然是行不通的innerHTML ...和你的逻辑的其余部分是错的太...

尝试：

$("#rolunk_content iframe").each(function() { 
    var div = document.createElement('div'), 
     rel = this.nextSibling, par = this.parentNode; 
    div.appendChild(document.createTextNode("1")); 
    div.appendChild(this); // the iframe 
    div.appendChild(document.createTextNode("2")); 
    par.insertBefore(div,rel); 
});

Vanilla JS可能更长写的，但它是在做你期望它做什么方面更可靠;）

来源

2014-02-28 13:02:01

那个杀了IFRAME –

“杀”了吗？你是什么意思？所有这一切都将它附加到一个新的poooooh，对，当你这样做时，浏览器不喜欢它。对不起，没有真正的修复。这是浏览器的限制。 –

这里是一个小提琴：http://jsfiddle.net/nE3jG/ –

如果您只想将IFRAME转换为DIV，则可以使用jQuery .append() API。

$("#newdiv").append($("#rolunk_content iframe"));

您的代码可能是这样的：

<div id="rolunk_content"> 
    <p><iframe src="...." width="200" height="200"></iframe></p> 
</div> 
<input id="d" type="button"> 
<hr> 
<div id="newdiv">Your IFRAME will be moved here.</div>

和Javascript：

$('#d').click(function() { 
    $("#newdiv").append($("#rolunk_content iframe")); 
});

的小提琴是在这里： http://jsfiddle.net/2HrA4/

和jQuery .append()的文件是在这里： https://api.jquery.com/append/

来源

2014-02-28 13:30:23 naota

如何将IFRAME移动到DIV中？

回答

相关问题