Загрузка svg на страницу из директории?

Question

[Дима Паутов]

Вот есть такой пример для загрузки подгрузки картинок.

$('button').click(function(){
		var idImg = $(this).data('icon');
		$('div').html('<img src="/images/ico/'+idImg+'.png">');
	});

и загружаем нужную картинку!
Как сделать подобное на svg, но, нужно получить код svg файла, не в тег img вставить путь, как выше, а получить полностью svg код изображения и вставит его в блок, что бы дальше можно было изменять эту картинку!
Подобную реализацию предлагает evil-icons.io/., но там вставляется полностью svg спрайт из js файла(где он тупо уже прописан) и вставленные иконки ссылаются на символы через id.

Возможно ли?

Answer 1

[Александр Рулёв]

Вы можете ajax-запросом получить содержимое svg, создать из этой строки элемент и добавить в DOM.

$('button').click(function(){
  $.get("/some.svg", function(data) {
    var svgEl = $(data);
    $('div').empty().append(svgEl);
  }, 'text');
});

Пример: https://dl.dropboxusercontent.com/u/10234425/toste...

Comments

[Дима Паутов]

Блин, точно, я что-то не допер сразу! Щас попробую!

[Дима Паутов]

Не получается, пишет ошибку "Uncaught TypeError: Cannot read property 'ownerDocument' of null"

[Александр Рулёв]

Дима Турков: да, нужно было указать тип контента, иначе jQuery пытается распознать, видимо, замечает xml и получается те то, что мы хотели. Обновил ответ, добавил пример:

https://dl.dropboxusercontent.com/u/10234425/toste...

[Дима Паутов]

ХАХАХА, мужик, заработало)))) Моему счастью нет границ, большущее человеческое спасибо!!!!!