Question

我有像这样的HTML结构

<div>
    <div><span id="span1">Test 1</span></div>
    <div><span id="span2">Test 2</span></div>
    <div><span id="span3">Test 3</span></div>
    <div><span id="span4">Test 4</span></div>
</div>

我必须插入一个svg元素，使用jQuery我可以轻松地像

一样

for(var i in arr)
    $('.span' + i).parent().append('<svg />')

如何使用D3.js实现同样的效果？由于d 3.select('.span' + i).parent提供错误parent is not a function

Answer 1

var pnode = d3.select('.span' + i).node().parentNode

d3.select返回一个选择，使用node（）返回实际的dom节点，然后使用parentNode获取父节点

然后你必须在另一个d3选择中重新选择那个父节点来做d3的事情

d3.select(pnode)

PS。对于上面的示例，它需要是'#span'来按id选择节点，而不是'.span'（并且最好一次选择所有节点然后。结果而不是循环）但我认为这是涵盖的父母的事情

使用D3js将元素插入为兄弟

1 个答案: