d3js在另一個標簽內添加標簽

Question

我想像這樣在HTML中創建圖例：

<li><span style="background-color:#n;"></span> Label</li>

但是輸出是：

<li>Label <span style="background-color:#n;"></span></li>

這是我的代碼：

d3.select("#myid").selectAll("li")
.data(dataset)
.enter().append("li")
.text(function(d) {return d;})
.insert("span")
.attr('style', function(d, i) {return "background-color:" + color});

有什么建議嗎？ 謝謝

Answer 1

只需在文本之前插入跨度即可：

d3.select("#myid").selectAll("li")
.data(dataset)
.enter()
.append("li")
.text(function(d) {return d;})
.insert("span", ":first-child")
.attr('style', function(d, i) {return "background-color:" + color});

Answer 2

好的，最后我用css float左端固定了@Asad代碼。