在網頁中重新記錄SVG圖標？

Question

我正在寫一個相當複雜，大而長的生活（它可能會顯示多天）的網頁，也將需要圖標。這些圖標應該是SVG圖形。根據頁面上的位置，SVG應該通過JavaScript調用重新着色（jQuery甚至jQuery-SVG都可以）。

所以我的問題是：

• 什麼是包含在網頁中的SVG的最佳方式？
  • <img>
  • <object>
  • jQuery(...).svg({loadUrl:...})
  • ...
• 如何 「正片疊底」 呢？
  • 預加載隱藏<div>和clone（）？
  • 只需按需加載？
• 什麼來設置SVG的最佳方式？ （在不同圖層上的一個文件中的所有圖標？一個文件中的所有圖標按位置分開？每個圖標一個文件？）
• 然後重新着色圖標的最佳方法是什麼？ （想想組成了一個線圖形的比較抽象的圖標，其中該行應該得到不同的顏色）

必需的瀏覽器是通常符合現代的（火狐，Chrome，歌劇，Safari瀏覽器），用於普通PC以及移動（Android，iOS）。 Internet Explorer兼容性不是必需的。

Answer 1

如果你想recolour它，然後<img>超出直線距離，你不能改變的javascript圖像外部或內部。

如果您添加了克隆數據，那麼您需要確保任何id屬性在單個文檔中保持唯一，因此可能對<object>這些東西最簡單。

您可以直接使用DOM調用來改變事物的顏色在SVG圖形，或者如果你願意，你可以使用jquery。

其餘的你可能不得不嘗試一下，看看它們是如何爲你工作的。