在 iFrame 页面内容之前将 html 内容插入 iFrame答案

【问题标题】：Insert html content into iFrame before the iFrame page contents在 iFrame 页面内容之前将 html 内容插入 iFrame
【发布时间】：2015-03-05 06:27:41
【问题描述】：

我想将 html 内容插入 iFrame。要求是我想在 iFrame 页面内容之前插入/附加此内容。
我有以下示例代码。目前我使用了 append 函数，它在 iframe 页面内容之后附加新内容。

TestPage.html

<html>
<head>
    <script src="jquery.js"></script>
    <title>Test Page</title>
</head>
<body>
    <iframe id="sampleIframe" src="PopupPage.html" width="400" height="150"></iframe>
    <script type="text/javascript">
        $('#sampleIframe').load(function () {
            var myFrame = $('#sampleIframe').contents().find('body');
            myFrame.append('<div><h3>Hello, World</h3></div>');
        })
    </script>
</body>
</html>

PopupPage.html

<html>
<head>
    <title>Popup Page</title>
</head>
<body>
    You are on popup page.  
</body>
</html>

【问题讨论】：

标签： javascript jquery html iframe

【解决方案1】：

还有类似 prepend 的东西

 parent.insertBefore(el, parent.firstChild);

它将添加到您父母的第一个孩子

或者使用等效的 jQuery

$(parent).prepend(el) 所以你的代码看起来像这样：

myFrame.prepend($('<div><h3>Hello, World</h3></div>'));

【讨论】：

我尝试了 insertBefore 和 prepend as 1) $('
Hello, World
').insertBefore(myFrame); 2) myFrame.prepend($('
Hello, World
'));并发现 prepend 对我有用。 insertBefore 也可以工作，但它会在 iFrame 标签之前插入内容。谢谢:)