Встраивание загруженного SVG с помощью jQuery

Question

Я загружаю svg, используя jQuery и тег файла:

HTML:

 <input type='file' />
 <img id="myImg" src="#" alt="your image" />

jQuery:

 $(function () {
$(":file").change(function () {
    if (this.files && this.files[0]) {
        var reader = new FileReader();
        reader.onload = imageIsLoaded;
        reader.readAsDataURL(this.files[0]);
    }
});
});

         function imageIsLoaded(e) {
             $('#myImg').attr('src', e.target.result);
  };

SVG загружается нормально и отображается на изображениитег.Проблема в том, что мне нужно встраивать SVG в HTML, а не только показывать его как изображение. Есть идеи, как получить код SVG и встроить его в HTML?

Answer 1

Я хочу отослать вас к документам

Там написано, что вы возвращаете строку в кодировке base64 с атрибутом данных.Поэтому, чтобы получить чистый текст, вам нужно удалить «data: * / *; base64» (в вашем случае, вероятно, image / svg + xml для * / *, но вы можете посмотреть это в инструментах разработки) вначало и чем делать декодирование base64.После этого вы сможете поместить svg прямо в дом.

Декодирование:

let base64 = e.target.result.split('base64,')[1];
let clear = atob(base64);