在HTML5 / CSS3 / Javascript应用程序中使用SVG图像的首选方法是什么？

Question

我所知道的选项包括<svg>，<object>，<embed>，<img>和<iframe>。它们的优点和缺点是什么？还有其他人吗？

Answer 1

<iframe>，<embed>和<object>都嵌入了外部svg文件，它们都允许编写脚本。 <embed>似乎或多或少是事实上的标准。 HTML5规范说：

• iframe元素表示嵌套的浏览上下文。

• embed元素表示外部（通常是非HTML）应用程序或交互式内容的集成点。

• object元素可以表示外部资源，根据资源的类型，它将被视为图像，嵌套浏览上下文或要处理的外部资源。通过插件。

<svg>仅适用于内联svg内容，但可以包含带有外部内容的<image>元素。

<img>和嵌套的<image>元素不允许编写脚本。

来源：

• http://dev.w3.org/html5/spec/the-iframe-element.html#the-iframe-element
• http://dev.w3.org/html5/spec/the-embed-element.html#the-embed-element
• http://dev.w3.org/html5/spec/the-object-element.html#the-object-element