iframe 框架技术

最新推荐文章于 2024-01-24 15:33:23 发布

快乐的小小编

最新推荐文章于 2024-01-24 15:33:23 发布

阅读量1.4k

点赞数

分类专栏： javascript 文章标签： iframe

本文链接：https://blog.csdn.net/xiaobianjava/article/details/48573163

版权

javascript 专栏收录该内容

28 篇文章 0 订阅

订阅专栏

1、定义：

iframe元素会创建包含另外一个文档的内联框架，即行内框架。

作用就是将其他的网页嵌入到自己的页面汇中。

2、理解：

1.首先iframe是一个过时的技术，它是一个独立的作用域，

2.会阻塞主页面的onload事件

3.iframe和主页面共享连接池，而浏览器对相同作用域的连接有限制，所以会影响页面的并行加载

4.可以解决一些跨域问题

3、防止别人引用自己的页面

demo：

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>index</title>
</head>
<body>
  <h1>index首页</h1>
  <iframe src="frame.html" frameborder="1"></iframe>
</body>
</html>

frame.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>frame1</title>
  <script>
    if(window != top){  //判断当前的window对象是否是top对象

      //如果不是，将top对象的网址自动导向被嵌入的网址，也就时iframe框架的url，提升到浏览器顶层
      top.location.href = window.location.href;
    }
  </script>
</head>
<body>
  <h1>这是frame1的页面</h1>
</body>
</html>

快乐的小小编

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
iframe 框架技术

1、定义：iframe元素会创建包含另外一个文档的内联框架，即行内框架。作用就是将其他的网页嵌入到自己的页面汇中。2、理解：1.首先iframe是一个过时的技术，它是一个独立的作用域，2.会阻塞主页面的onload事件3.iframe和主页面共享连接池，而浏览器对相同作用域的连接有限制，所以会影响页面的并行加载4.可以解决一些跨域问题3、防止别人引用
复制链接

扫一扫