如何使用jQuery或JavaScript從html頁面獲取SVG代碼？

Question

我有svg這樣的簡單HTML頁面：

<div id="plan">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<g id="layer3">
   <rect width="105.71429" height="80" x="351.42856" y="152.36218" id="rect1" style="fill:#008000"></rect>
   <rect width="120" height="85.714287" x="500" y="389.50504" id="rect2" style="fill:#008000"></rect>
</g>
</svg>
</div>

我如何獲得字符串：

<rect width="105.71429" height="80" x="351.42856" y="152.36218" id="rect1" style="fill:#008000"></rect> 

從這個svg。 我可以使用jquery和jquery svg。 我嘗試：

    $(document).ready(function() {
    console.log($("#plan #rect1")[0]);
})

在控制台中，我使用此字符串，但是我必須在這樣的變量中獲取字符串：

var str = $("#plan #rect1")[0];

變量str是[object SVGRectElement] [在此處輸入鏈接描述] 1

Answer 1

為了合並先前的答案（起初我不太清楚），獲取SVG字符串的方法如下：

var str = $('<div>').append($('#plan #rect1').clone()).html(); 

Answer 2

$('#rect1')[0]

這應該有所幫助。 如果要訪問標記而不是jQuery元素，請使用[]獲取封裝的元素。

編輯 ：

這應該為您解決問題 。

解釋的解決方案是將您的選擇包裝到另一個標記中，並在其上調用.html（）以顯示其內容。

在將.clone（）調用追加到temp div之前，請不要忘記它，否則您的html會遇到一些麻煩:)