iframe
(inline frame,内联框架)是 HTML 标签,用于在一个网页内嵌入另一个网页。它通常用于:
- 广告嵌入(如 Google Ads)
- 视频播放器(如 YouTube、Bilibili)
- 第三方登录页面(如 Google 登录)
- 在线支付(如支付宝、微信支付)
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>嵌入 iframe 示例</title>
</head>
<body>
<h1>主页面</h1>
<iframe id="myIframe" src="https://www.example.com" width="800" height="600" frameborder="0" allowfullscreen></iframe>
</body>
</html>
在上面的代码中,iframe
的 src
属性指向 https://www.example.com
,宽度 800px,高度 600px,并且去掉边框,这意味着主页面将嵌入该网站的内容。
作用:
- 嵌入外部网页(如 Google Maps、YouTube 视频)
- 提高安全性(防止 XSS 攻击)
- 创建独立的 DOM 结构(避免 CSS、JS 冲突)
sandbox
安全沙盒 iframe
为了防止 iframe
影响主页面,可以使用 sandbox
属性:
&