Как использовать селекторы jQuery с SVGweb - PullRequest
Новая
       32

Как использовать селекторы jQuery с SVGweb

1 голос
/ 10 ноября 2011

Я хочу использовать селекторы jQuery в SVG.В браузерах с поддержкой 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 */

Примечание: я еще не тестировал другие селекторы.

Мой вопрос: как мне заставить их работать?

Примечание: если это невозможно, короткое объяснение (и, возможно, какой-то обходной путь для этого ограничения) может заработать галочку.

1 Ответ

0 голосов
/ 23 февраля 2012

(с использованием Firefox)

Я использую подход embed-in-an- <object> для кросс-браузерной совместимости: 

<!--[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]-->

... затем используйте contentDocument узла <object>, чтобы сообщить jQuery() об этом новом DOM ... 

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

... и вы должны иметь возможность основывать вещи на $svg: 

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