schnellste Weg, um die untergeordneten Knoten svg Element zu löschen, ohne event.target

Question

bearbeiten zu entfernen: Wenn ein Ereignis auf das Kind-Element durch jQuery verhakt ist, dann verwenden .empty $, sonst Speicherverlust auftreten.

Ich füge Pinching-Unterstützung für mein SVG-Widget hinzu. Es gibt ungefähr 50 oder mehr Kindknoten. Ich benutze folgenden Code, um das Widget während Touchmove oder pointermove zu zeichnen.

function pinchMoveHandler(event){ 
    var svg = this.widgetObject; 
    event.target.id = ""; 
    event.target.setAttribute("opacity", 0); 

    //do not remove event.target during touchmove or pointermove 
    //If removed, event will be suspended 
    svg.appendChild(event.target); 
    while(svg.childNodes.length > 1) 
     svg.removeChild(svg.firstChild); 

    //Scaling and re-rendering operations will take place here 
    this.drawWidget(event); 
} 

Das Problem ist, svg entfernt langsam (40 Millisekunden während des laufenden pointermove Ereignis in IE11), weil Zeiger bewegen sich eine nach der anderen ausgelöst, auch wenn ich nicht meinen Finger bewegen. Was ist der schnellste Weg, um ein SVG-Element in JavaScript zu löschen? jQuery-Lösung ist auch akzeptabel.

Hinweis: Im normalen Szenario entfernt SVG in weniger als 10 Millisekunden

Answer 1

jQuery-Lösung;

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

jQuery-Lösung-2; (Prevent Ziel)

$(svg).children().not(':last').remove(); 

jQuery Lösung-3; (Prevent Ziel)

$(svg).find('*').not(':last').remove(); 

jQuery Lösung-4; (Re-append Ziel)

$(svg).empty().append(event.target); 

Vorgeschlagene Lösung;

Wenn Sie keine andere Operation zu tun haben, empfehle ich Ihnen, dass; "mache eine klare Kopie" von SVG. Ich meine, erstelle ein neues (leeres) SVG und ersetze das alte damit.