D3選擇具有沒有id

以下

<g id="s1s2" class="contact"> 
    <g class="baseCircle"> 
     <path id="s1s2_base"> 
    </g> 
    <path > 
    <path > 
</g>

，我想獲得所有沒有ID的路徑。我試圖

d3.select('g#s1s2.contact').selectAll('path:not(id)');

返回所有路徑：

[[path#s1s2_base, path, path]]

什麼建議嗎？

來源

2017-01-23 flebas

您的選擇器有點偏離。要選擇所有沒有id屬性的元素，可以使用"path:not([id])"。請注意，這是如何使用附加的方括號表示這實際上是attribute selector。

console.log(d3.selectAll("path:not([id])").size()); // 2

<script src="https://d3js.org/d3.v4.js"></script> 
 

 
<svg> 
 
    <g id="s1s2" class="contact"> 
 
     <g class="baseCircle"> 
 
      <path id="s1s2_base"/> 
 
     </g> 
 
     <path /> 
 
     <path /> 
 
    </g> 
 
</svg>

來源

2017-01-23 12:47:00 altocumulus

-1

你必須改變你不想選擇元素的ID id：

d3.select('g#s1s2.contact').selectAll('path:not(#s1s2_base)');

來源

2017-01-23 11:56:56 albert

在D3，而第二個參數的.attr()功能可以作爲一個吸氣。

因此，選擇所有<path>並過濾它們，從而消除具有ID的那些。在這種情況下，

!d3.select(this).attr("id")

對於這樣的路徑將返回true。

var noId = d3.selectAll("path").filter(function() { 
 
    return !d3.select(this).attr("id") 
 
}); 
 

 
console.log(noId.attr("class"));

<script src="https://d3js.org/d3.v4.min.js"></script> 
 
<svg> 
 
\t <path id="foo" class="hasID"></path> 
 
\t <path id="bar" class="hasID"></path> 
 
\t <path class="noID"></path> 
 
\t <path id="baz" class="hasID"></path> 
 
</svg>

PS：作爲S.O.當試圖對D3選擇console.log時，代碼段是凍結的，這裏是一個具有相同代碼的小提琴：https://jsfiddle.net/n615hqub/

來源

2017-01-23 12:25:18

D3選擇具有沒有id

回答

相關問題