Tại sao .html() không hoạt động với bộ chọn SVG bằng jquery?

Question

Câu hỏi một số có thể cho tôi biết làm thế nào tôi có thể chuyển đổi phần tử SVG thành chuỗi?

Tôi đang sử dụng canvg để chuyển đổi SVG của tôi thành hình ảnh.

nó phải được render trong một khung đầu tiên, phương pháp canvg() được mong đợi một mã SVG STRING

:

function updateChartImage(){ 
     canvg(document.getElementById('canvas'),expecting ` svg string`); 
     var canvas = document.getElementById("canvas") ; 
     var img = canvas.toDataURL("image/png"); 
     img = img.replace('data:image/png;base64,', ''); 
     $("#hfChartImg").val(img) ; 
     $('#img').attr({ src: img }); 
     } 

tôi đã cố gắng

$('#container svg').html() ; // it gives me an error 
//Uncaught TypeError: Cannot call method 'replace' of undefined 

thông báo rằng

$('#container svg') 
    $('#container').html() // both works fine and 

Cập nhật

Tôi đang sử dụng highcharts đều có một chức năng getSVG() mà tôi có thể vượt qua các canvg() nhưng vấn đề là nó doesnt có được các bản cập nhật mới nhất, vì vậy tôi phải làm nó theo cách này, khi chạy getSVG() chức năng tôi nhận được như sau:

LINK

Answer 1

theo như tôi có thể nhớ lại jQuery .html() tận dụng innerHTML đó có nghĩa là cho html, không phải svg. của SVG là các tài liệu xml, vì vậy bạn có thể sử dụng XMLSerializer()

var svg = document.getElementById('svg_root'); // or whatever you call it 
var serializer = new XMLSerializer(); 
var str = serializer.serializeToString(svg); 

Answer 2

Đối với vấn đề bạn không nhận được nội dung svg của bạn,
Nếu chỉ có một biểu đồ svg là trên trang sau đó sử dụng:

$('svg').html(); 

và nếu nhiều hơn hiện tại sau đó xin vui lòng xem có một div highcharts_container bởi vì họ tạo ra rằng các biểu đồ svg. Nếu bạn đang sử dụng chúng.
Sau đó, sử dụng:

$('id of that div').html();