如何使用jQuery或JavaScript从html页面获取SVG代码? [英] How get SVG code from html page, using jQuery or JavaScript?

问题描述

我有一个带有svg的简单HTML页面，如下所示:

I have simple HTML page with svg like this:

<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.我尝试:

from this svg. I can use jquery and jquery svg. I try:

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

在控制台中，我使用此字符串，但是我必须在这样的变量中获取字符串:

In console i take this string, but i must get string in variable like this:

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

变量str是[object SVGRectElement] [在此处输入链接说明] 1

variable str is [object SVGRectElement] [enter link description here]1

推荐答案

$('#rect1')[0]

这应该有所帮助.如果要访问标记而不是jQuery元素，请使用[]获取封装的元素.

This should help. If you want to access tag instead of jQuery element, use [] to get encapsulated element.

编辑:

这应该为您解决问题.

解释的解决方案是将您的选择包装到另一个标记中，并在其上调用.html()以显示其内容.

The solution explained is to wrap your selection into another tag and call .html() on it to display its content.

在将.clone()调用添加到temp div之前，请不要忘记它，否则您的html会遇到一些麻烦:)

Don't forget the .clone() call before appending it into your temp div, otherwise you will have some trouble in your html :)

这篇关于如何使用jQuery或JavaScript从html页面获取SVG代码?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！