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 的对比

对比项embedobject
结束标签
后备内容不支持支持
参数传递少用可嵌套 param 标签
HTML5 地位新标签老标签但仍在用

现状与使用建议

  • 能原生做的事就别用插件:音视频用 video/audio,动画用 Canvas/SVG。
  • Flash、Java Applet 已被主流浏览器停止支持,不要再在页面中使用。
  • 需要展示 PDF、SVG 等文档时,iframe 或 embed/object 仍是可用方案。

小结:插件通过 <embed><object> 嵌入 PDF、SVG 等外部内容,弄清二者的写法与差异即可;如今应优先使用 HTML5 原生标签,插件只作补充。

笔记加载中…