¿Hay alguna manera fácil de borrar los contenidos de un elemento SVG?

En HTML, puedo borrar un elemento de <div> con este comando:¿Hay alguna manera fácil de borrar los contenidos de un elemento SVG?

div.innerHTML = "";

¿Hay un equivalente si tengo un elemento <svg>? No puedo encontrar un innerHTML ni innerXML o incluso innerSVG método.

Sé que el DOM SVG es un superconjunto del XML DOM, por lo que sé que puedo hacer algo como esto:

while (svg.lastChild) { 
    svg.removeChild(svg.lastChild); 
}

Pero esto es tedioso y lento. ¿Hay una forma más rápida o más fácil de borrar un elemento SVG?

Fuente

2010-09-09 Aseem Kishore

Ya ha dado una respuesta: siempre puede pasar el cursor sobre todos los niños y eliminarlos. Si crees que tienes demasiados nodos secundarios, entonces tal vez quieras reemplazar el nodo svg por uno vacío. Si su nodo svg tiene algunos atributos, puede usar una etiqueta donde coloque todos los nodos secundarios y luego simplemente reemplace el nodo con uno vacío.

Fuente

2010-09-23 13:25:11 Volker

Reemplazar es una buena idea, ¡gracias! –

usar esto? http://keith-wood.name/svg.html

también hay Raphael: jQuery SVG vs. Raphael

estaría tentado de hacer búsquedas en y ver que ellos están haciendo sus métodos .destroy().

Fuente

2010-09-09 06:31:43

parece que están haciendo exactamente lo Aseem es: paperproto.clear = function() {var c = this.canvas; while (c.firstChild) { c.removeChild (c.firstChild); } – robertc

element = document.getElementById("elementID"); 
element.parentNode.removeChild(element);

me ocurrió la idea de http://www.carto.net/svg/manipulating_svg_with_dom_ecmascript/

Fuente

2013-01-28 22:19:00 Travis

Eso eliminaría el elemento en sí mismo en lugar de simplemente vaciarlo, pero de hecho funciona para SVG. – howard10

¿Cómo eliminar todo el elemento 'trabajo'? Esto no es lo que se preguntó. –

Si estás usando jQuery, que sólo puede hacer

$("#svgid").empty();

Este deletes all child elements del SVG, dejando sus otros atributos como la anchura y la altura intacta .

Fuente

2013-06-11 17:37:05 FrancesKR

Esto era exactamente lo que estaba buscando. – QueueHammer

Elimina etiquetas :( –

Usar commnet de john ktejik. Usar empty() borra todas las definiciones. Usar el bucle solo borra las definiciones asociadas específicamente con un elemento secundario eliminado. – ouflak

He intentado svg.text("") y parece que funciona. Borra todo el texto interno, guarda los atributos.

Fuente

2014-04-23 06:20:06

me sale el error 'no es una función' –

Si la pregunta no tiene jQuery como etiqueta, no la publique como respuesta sin especificar que la está usando. – theonlygusti

Usa d3.js. Esto eliminará todos los nodos de contenido de svg.

svg.selectAll("*").remove();

Fuente

2014-05-15 08:55:13

error: undefined no es una función –

Puede usar el clon y reemplazar el elemento con el clonado.

var parentElement = svg.parentElement 
    var emptySvg = svg.cloneNode(false); 
    parentElement.removeChild(svg); 
    parentElement.appendChild(emptySvg);

Esto añadirá el SVG al final, es posible que desee obtener el elemento antes y anexar accordinaly

Fuente

2015-08-14 03:53:30

Estoy de acuerdo en usar el clon y reemplazar el elemento con el clonado.

Sólo una línea de código:

svg.parentNode.replaceChild(svg.cloneNode(false), svg);

Fuente

2015-12-21 04:46:11 cuixiping

¿Hay alguna manera fácil de borrar los contenidos de un elemento SVG?

Respuesta

Cuestiones relacionadas