Question

我正在使用jQuery SVG插件在客户端（Web浏览器）端使用SVG。

在特定情况下，我必须向SVG添加FontAwesome图标。 SVG上的FontAwesome图标运行良好，通常，如果它们是原始SVG的一部分，它由jQuery SVG插件加载。

通过使用以下行添加动态图标来显示问题，其中mainSVG是全局SVG对象。

mainSVG.text(null, x, y, '&#'+iconCode);

其中iconCode类似于“xf007” ...然后添加一些位置和样式属性。

将文本元素添加到svg工作正常。结果是一个字符串'&#xf007'，它增加了对文本对象的洞察力，该文本对象现在是svg的一部分。

<text x="49" y="139" style="font-family: FontAwesome; 
      font-weight: normal; font-size: 6px;" class="dot">

      &#xf007 

</text>

但是：它显示为字符串而不是图标。顺便说一下：加载了FontAwesome的css样式定义，并且已知对SVG的了解。

问题是：如果我使用firebug修改SVG进行非常微小的更改（比如在SVG元素之间添加空格），则图标会变得明显。

对我而言，这是一种非常奇怪的行为，浏览器根本没有注意到新添加的图标。或者：浏览器只有在使用firebug对svg对象进行一些微小更改后才会注意到新添加的图标。

所以我的问题是：如何使用jQuery向svg添加动态FontAwesome图标，或者如何通过使用现有的css定义触发浏览器/ svg“viewer”插件来注意图标以显示图标？