HTML 插件
插件(Plug-in)是嵌入网页、扩展浏览器能力的小程序,常见的有 PDF 阅读器、Flash 播放器等。HTML 里主要用 <object> 和 <embed> 标签嵌入这类外部内容。随着 HTML5 原生能力增强,Flash 插件已被淘汰,但 object、embed 仍有存在的价值。
什么是插件
插件可以看作"浏览器的外挂":浏览器本身处理不了的内容交给它处理。常见用途:
- 在网页中直接显示 PDF 文档。
- 播放 Flash 动画(已废弃,仅作了解)。
- 运行 Java Applet(已废弃)。
embed 元素
embed 是 HTML5 新标签,用来嵌入外部内容,没有结束标签:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>插件示例</title>
</head>
<body>
<h3>内嵌 SVG 图片</h3>
<!-- 用 embed 嵌入 SVG 文件 -->
<embed src="circle.svg" type="image/svg+xml" width="300" height="200">
</body>
</html>
在浏览器中显示为:页面标题下直接渲染出 SVG 图形,就像普通图片一样。
object 元素
object 同样用来嵌入外部内容,有成对的结束标签,还能写后备内容:
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>object 示例</title>
</head>
<body>
<h3>内嵌 PDF 文档</h3>
<!-- data 指向资源,type 声明 MIME 类型 -->
<object data="manual.pdf" type="application/pdf" width="500" height="400">
您的浏览器无法显示 PDF,请 <a href="manual.pdf">下载查看</a>
</object>
</body>
</html>
在浏览器中显示为:页面内嵌一个 PDF 阅读窗口;若浏览器不支持,则显示后备的"下载查看"链接。
object 与 embed 的对比
| 对比项 | embed | object |
|---|---|---|
| 结束标签 | 无 | 有 |
| 后备内容 | 不支持 | 支持 |
| 参数传递 | 少用 | 可嵌套 param 标签 |
| HTML5 地位 | 新标签 | 老标签但仍在用 |
现状与使用建议
- 能原生做的事就别用插件:音视频用 video/audio,动画用 Canvas/SVG。
- Flash、Java Applet 已被主流浏览器停止支持,不要再在页面中使用。
- 需要展示 PDF、SVG 等文档时,iframe 或 embed/object 仍是可用方案。
小结:插件通过 <embed>、<object> 嵌入 PDF、SVG 等外部内容,弄清二者的写法与差异即可;如今应优先使用 HTML5 原生标签,插件只作补充。