Question

所有

我想做的是：

<div id="container">
    <div class="unwanted"></div>
    <div class="unwanted"></div>
    <svg><rect></rect></svg>
    <div class="unwanted"></div>
<div>

如何为该svg获取#container的innerHTML，所以我得到的是：

"<svg><rect></rect></svg>"

Answer 1

你想要的是svg Element的outerHTML，但实际上并不是这样。在这里

outerHTML of an SVG element

是如何获取带有内容的svg的想法。

Answer 2

在这种情况下，这将为您提供所需的内容：

document.getElementById('container').getElementsByTagName('svg')[0].innerHTML;

Answer 3

jquery的

var container = $("#container").html().find('svg');
// or
 $("#container svg").html();

//return <rect></rect> you can use '<svg>'+container+'</svg>'

的javascript

var container = document.getElementById('container');
var svg = container.getElementsByTagName('svg')[0].innerHTML;

//return <rect></rect> you can use '<svg>'+container+'</svg>'

或在Why .html() doesn't work with SVG selectors using jquery ?

上查看@ Duopixel的答案

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

如何从一个指定子ELEMENT获取innerHTML

3 个答案: