如何将 jQuery 选择器与 SVGweb 结合使用

Question

我想在 SVG 上使用 jQuery 选择器。在支持本机 SVG 的浏览器上，所有选择器都可以正常工作。 但在浏览器上（实际上，我只测试了 ie8），其中 SVGweb 使用 Flash 渲染器，只有某些选择器可以工作，例如：

$('#id')             /* id selectors works*/
$('#id #another-id') 
$('*')                /* universal selector works */  

有些选择器不起作用：

$('path')            /* type selectors don't work */
$('.region')         /* class selectors don't work */

注意：我还没有测试其他选择器。

我的问题：我如何让他们工作？

注意：如果这是不可能的，一个简短的解释（也许还有针对此限制的某种解决方法）可能会赢得复选标记。

Answer 1

（使用 Firefox）

我使用 embed-in-an-

<!--[if !IE]>-->
  <object data="path-to.svg" type="image/svg+xml" id="object-id">
  </object>
<!--<![endif]-->
<!--[if lt IE 9]>
  <object src="path-to.svg" classid="image/svg+xml" id="object-id">
  </object>
<![endif]-->
<!--[if gte IE 9]>
  <object data="path-to.svg" type="image/svg+xml" id="object-id">
  </object>
<![endif]-->

...然后使用

var svgdoc = $('object-id').get(0).contentDocument;
var $svg = $(svgdoc).children();

...您应该能够以 $svg 为基础:

var $paths = $('path',$svg);
$svg.find('rect').attr('fill','blue');