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

时间:2015-03-05 06:27:42

标签: javascript jquery html iframe

我想将html内容插入iFrame。要求是我想在iFrame页面内容之前插入/附加此内容。
我有以下示例代码。目前我使用了追加功能,它在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>

1 个答案:

答案 0 :(得分:0)

还有像prepend

之类的东西
 parent.insertBefore(el, parent.firstChild);

它将作为您父母的第一个孩子的前缀

或者使用jQuery等价物

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

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