SVG: компактный способ создания немного разных элементов?

Question

Я создаю несколько элементов, которые являются почти идентичными путями, с длинным списком координат.Есть ли компактный способ создать один элемент и сделать несколько разные его копии?

Элементы созданы 'createElementNS'.Очевидный (я думаю) ответ состоит в том, чтобы клонировать первый элемент в новый элемент и установить только атрибуты во втором элементе, которые изменились.Это работает в Chrome и IE9, но не в FF4 или Opera.

Другое очевидное решение - просто скопировать первый элемент в var и установить измененные атрибуты в var.Это не работает в Chrome или FF.

Я мог бы создать новый элемент через createElementNS и скопировать все атрибуты из старого элемента, но я не знаю способа циклически проходить через всеатрибуты, которые могли бы помочь.

Это пример почти работающего кода клона:

obj = svgDocument.createElementNS(svgns, "path");
obj.setAttributeNS(null, "id", "pbox1");
...lots more attributes set
svgDocument.documentElement.appendChild(obj);

// now try to clone and copy:
var obj2 = obj.cloneNode(true);
obj2.setAttributeNS(null, "id", "pbox2");
...change a few obj2 attributes
svgDocument.documentElement.appendChild(obj2);

Есть идеи?

Спасибо -

Al

Answer 1

ааа .. глупая опечатка с моей стороны;извиняюсь.Код, который я разместил выше, был верным, но я не показывал другие клоны внизу.На последнем я вставляю var obj10 = obj.cloneNode(), оставляя «истину».Похоже, что FF4 и Opera получили правильный ответ, а Chrome и IE9 все равно скопировали все атрибуты.

Answer 2

var templateElement =  document.createElement(// create template element);

var firstElement = templateElement.cloneNode(true) // the true make sure it clones all child nodes
var firstElement.setAttribute()// change what you need

и так далее для любого количества элементов.