ajax获取到的svg如何渲染到页面

emmm,周五碰到一个难题,今早查了下百度、秒懂了。哎。看来还是太菜。

注意:如果直接使用 html(),或者text() 方法,肯定报错。

背景:

需要实现一个上传图片的功能,但是,默认加载的是svg格式的,上传的也是svg格式的。一共两个接口。
肯定先从服务器获取图片、
结果获取的内容是个#documennt

贴一下我的代码:

//获取默认图片
      $.ajax({
        type: "get",
        url: getUrl,
        data: {
          token: token
        },
        // dataType: "json", //不要有dataType    
        success: function (data) {
          console.log(data);
        }
      });

解决代码:

       $.ajax({
        type: "get",
        url: getUrl,
        data: {
          token: token
        },
        success: function (data) {
          console.log(data);
          let svgImg = data.getElementById("svg1");
          console.log(svgImg);
          $("#uploader-list").html(svgImg);
        }
      });

是不是超级简单。
这里需要注意的是,后台传输过来的svg必须带上id。
效果图

原文地址:https://www.cnblogs.com/Bianco/p/13625154.html