Jquery 使用绑定到DOM元素的D3数据更改其属性

我有一个D3.js的DAG可视化，使用了力导向布局。有时我想改变某些节点的颜色。到目前为止，我已经在click listeners中使用了

this

：

function clickNode(node) {
    d3.select(this).attr("fill", nodeHighlightColour);
}

但是，现在我想更改侦听器调用的函数中的节点颜色，而不是侦听器本身。它必须是一个单独的函数的原因是我想“突出显示”一系列节点，从单击的节点追溯，因此我需要递归调用函数（

tracePath

）

如果我从侦听器调用

tracePath

，当我尝试

d3.select（this）.attr（“fill”）

时，我会得到一个“undefined function”运行时错误。我猜这是因为

这个
已经不在范围之内了。我可以将
节点
对象传递给
跟踪路径
，但这是节点数据，而不是DOM元素。如何仅使用绑定到DOM元素的数据对象来获取DOM元素

编辑：
正如我在给Felix Kling的评论中所写的那样，我不能简单地将
这个
传递给
跟踪路径
。这将适用于第一个节点，但我仍然必须递归调用该函数。这是我迄今为止的
tracePath
函数：

// Trace the back from a node - node_el is "this", node is the node data
function tracePath(node_el, node) {
    var this_id = node.id;

    if (node.logic == null) {
            console.log("Highlighting!");
            // Using "this" to change colour
            d3.select(node_el).attr("fill", nodeHighlightColour);
    }
    // Look for edges that point to this node
    for (var i=0; i<edges.length; i++) {
            var e = edges[i];
            if (e.target == this_id) {
                    var next_node = None;

                    // Get the node at the source of the edge
                    for (var j = 0; j<nodes.length; j++) {
                        if (nodes[j].id == e.source) {
                            next_node = nodes[j];
                        }
                    }
                    // Recursively trace back from that node
                    if (next_id != None) {
                            // How do I get the DOM element to pass to tracepath?
                            tracePath(???, next_node);
                    }
            }
    }
}

//从节点回溯-节点是“this”，节点是节点数据
功能跟踪路径（节点，节点）{
var this_id=node.id；
if（node.logic==null）{
log（“突出显示！”）；
//用“this”改变颜色
d3.选择（node_el）.attr（“填充”，nodehighlightcolor）；
}
//查找指向此节点的边
对于（var i=0；i感谢Felix Kling对此的回答！正如他所建议的，我向每个SVG圆圈元素添加了一个与节点数据id相同的
id
，如下所示：

 circle = d3.select('#graphics').append("g").selectAll("circle")
         .data(force.nodes())
         .enter().append("svg:circle")
         .attr("id", function(d) {
              return d.id;
         })
         .on("click", clickNode)

然后，我可以使用节点id访问DOM元素。下面是我完成的
tracePath
函数：

// Trace the path back from a node
function tracePath(node_el, node) {
    var this_id = node.id;
    console.log("in tracepath");
    if (node.logic == null) {
            console.log("Highlighting!");
            d3.select(node_el).attr("fill", nodeHighlightColour);
    }
    console.log("this_id:", this_id);
    // Look for edges that point to this node
    for (var i=0; i<edges.length; i++) {
            var e = edges[i];
            if (e.target.id == this_id) {
                    console.log("edge from ", e.source.name);

                    // Recursively trace back from that node
                    var next_el = document.getElementById(e.source.id);
                    tracePath(next_el, e.source);
            }
    }
}

//从节点追溯路径
功能跟踪路径（节点，节点）{
var this_id=node.id；
控制台日志（“在tracepath中”）；
if（node.logic==null）{
log（“突出显示！”）；
d3.选择（node_el）.attr（“填充”，nodehighlightcolor）；
}
log（“this_id:”，this_id）；
//查找指向此节点的边
对于（var i=0；i
this
是DOM元素，所以只需将
this
传递给
tracePath
？@FelixKling噢，哈哈，谢谢……应该想到这一点。@FelixKling事实上这不太可能……因为我需要在不同的节点上递归调用
tracePath
。我可以通过获取节点的
id
f来获取节点数据rom的相关边缘，但我仍然需要访问它的DOM元素。我将编辑我的问题，很抱歉我忘记了。如果您设置代码以便为表示节点的SVG元素提供一个ID（相当于节点数据的
ID
值），那么您可以使用
document.getElementById（下一个ID）
获取对下一个节点的引用。