html中嵌套iframe页面

时间 2019-12-07 标签 html 中嵌套 iframe 页面

有时候须要把其余地方的页面嵌套到当前的的网站的某个模块中，就可使用iframe嵌套
一、不须要登陆其余网站的直接嵌套
新建htmljavascript

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>百度</title>
    <style> * { padding: 0; margin: 0; } html, body { height: 100%; width: 100%; overflow: hidden; } iframe { border: 0; } </style>
</head>
<body>
<iframe id="mainContent" width="100%" height="100%"></iframe>
</body>
<script> window.parent.Ext.onReady(function(){ var mainContent = document.getElementById('mainContent'); mainContent.src = "http:baidu.com.cn"})//嵌套网址 </script>
</html>

二、须要登陆其余网址才能够获取嵌套页面
新建htmlcss

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
    <style> *{ padding: 0; margin: 0; } html,body{ height: 100%; width: 100%; overflow: hidden; } iframe{ border: 0; } </style>
</head>
<body>
    <iframe id="mainContent" width="100%" height="100%"></iframe>
</body>
<script> window.parent.Ext.onReady(function(){ var Ext = window.parent.Ext ; Ext.data.JsonP.request({ url: 'url',//登陆网站 async: false, params: { RF_Login_Username:"ordinary", RF_Login_Password:123456//用户名和密码 }, callbackKey: "callback", callbackName: "callback", success:function(d){ var mainContent = document.getElementById('mainContent'); mainContent.src = "http:url"//嵌套页面网址 }, callBack:function(d){ }, failure: function (d) { alert('请求失败，请关闭窗口后从新打开！'); } }); }) </script>
</html>