如何附加一些HTML标记行？

Question

我想知道最好的方法是附加3/4行代码的标记。因此它有条理且易于编辑。

想要将此标记附加到我的HTML页面：

<g class="dot previous">
<circle class="inner" cx="8.921933085501859%" cy="45" r="8"/>
<circle class="outer" cx="8.921933085501859%" cy="45" r="12"/>
</g>

一种方法是在append()函数的引号之间超过上面的代码，但是当你想要附加很多这些标记时，这会搞砸你的标记。

请注意您的建议。 提前谢谢。

Answer 1

function appendCircle(parent, classes, cx, cy, r) {
  var circle = $('<circle></circle>');
  circle.addClass(classes);
  circle.prop({ 'cx': cx, 'cy': cy, 'r': r });
  $(parent).append(circle);  
}

var g = $('<div></div>');
g.addClass('dot previous');

appendCircle(g, 'inner', '8.921933085501859%', '45', '8');
appendCircle(g, 'outer', '8.921933085501859%', '45', '12');

$('body').append(g);