如何使用D3嵌套在另一個SVG元素（父級）中的SVG（子元素）元素的引用？

Question

我有幾個組（SVG G元素）嵌套在另一個組中，我想獲得他們的ID。我使用D3 JavaScript庫創建SVG，代碼看起來與此類似。

var body = d3.select("body"); 

var svg = body.append("svg") 
    .attr("width", '100%') 
    .attr("height", '100%') 

var outerG = svg.append("g") 
    .attr('id','outerG') 

var innerG1 = outerG.append('g') 
    .attr('id','innerG1') 

var innerG2 = outerG.append('g') 
    .attr('id','innerG2') 

我試圖用的childNodes屬性，但的console.log（outerG [0] .childNodes）給我不確定。無法找到正確的答案與谷歌搜索，可以請別人給我一個提示如何做到這一點？

Answer 1

這將工作：

console.log(outerG[0][0].childNodes); 

見jsFiddle here

需要兩個嵌套的指標是，所有的選擇都隱含分組的原因。如果您想知道更深層次的原因，或者想更好地瞭解選擇，請參見this article