Не удается заставить селекторы работать с библиотекой JQuery SVG

Question

У меня проблемы с получением внешне загруженного SVG для выполнения того, что я хочу, с помощью библиотеки SVG Кейта Вуда.

Я могу загрузить внешний SVG-штраф с помощью:

$(document).ready ( function () {  
      $("#some_id").svg({  
            loadURL: 'my_file.svg',  
            onLoad: my_function,  
            settings: {}  
          });  
});

Я могу получить my_function работает нормально.Я просто не могу заставить селекторы работать должным образом.

Мой загруженный извне SVG принимает форму:

<g id="parent_id">
  <path id = "child_1_id"  />
  <path id="child_2_id" />
  etc.  </g>

Я могу закрасить весь элемент parent_id с помощью:

svg.style('#parent_id {fill: blue}')

Но когда я пытаюсь:

svg.style('#child_id {fill: blue}')

ничего не происходит.

svg.style('g> path {fill: blue}') svg.style('g#parent_id > path {fill: blue}')

оба работают нормально - без проблем.Но в ту минуту, когда я ввожу #child_id, например:

svg.style('g#parent_id > path#child_id {fill: blue}')

, ничего не происходит.Я хочу иметь возможность стилизовать все элементы child_id отдельно.Чего мне не хватает?

Answer 1

Если ваш дочерний идентификатор уникален во всем документе svg, вы можете использовать следующий селектор jquery:

var selector = 'svg path[id="child_1_id"]';
$(selector).attr('fill', 'blue');