Question

是否可以创建多个节点？我有这个：

var = document.getElementById('svgID');
var ellipse = document.createElementNS("http://www.w3.org/2000/svg", 'ellipse'); 
test.setAttribute('cx', x);
test.setAttribute('cy', y);
test.setAttribute('rx', w);
test.setAttribute('ry', h);
test.appendChild(ellipse);

好吧，我可以复制上面的代码，重命名并创建多个节点，但是有没有更简单的方法呢？

Answer 1

更容易

addEllipse('svgID', {cx:x, cy:y, rx:w, ry:h}, test);


function addEllipse(svgID, info, toDom) {
  var = document.getElementById(svgID);
  var ellipse = document.createElementNS("http://www.w3.org/2000/svg", 'ellipse'); 
  toDom.setAttribute('cx', info.cx);
  toDom.setAttribute('cy', info.cy);
  toDom.setAttribute('rx', info.rx);
  toDom.setAttribute('ry', info.ry);
  toDom.appendChild(ellipse);
}

Answer 2

感谢所有人。

我的问题是我的数据结构是面向对象的，并且无法将SVG对象添加到类中，因为SVG对象已添加到DOM中。因此，我对其进行了更改，以使其在程序上起作用。

使用JavaScript和SVG创建多个节点

2 个答案: