d3是否有與jQuery.closest（選擇器）類似的api？

Question

DOM是這樣的：

<g.module> 
    <g.control> 
    <rect> 

我沒有找到最接近的API： https://github.com/mbostock/d3/wiki/API-Reference

我怎樣才能獲得最近匹配的元素，從它的父？就像這樣：

var module = d3.select(".control").closest(".module"); 

Answer 1

你可以使用jquery進行選擇並將其傳遞給d3。

var selection = $('.control').closest('.module'); 
var module = d3.select(selection); 

這可能會也可能不會工作取決於您需要它，但可能是一個簡單的解決方法。

Answer 2

如果你的DOM是真的那麼具體的例子，你可以用D3作爲其文檔here注意選擇父節點：

您可以通過檢查各組的parentNode屬性看到每個組的父節點數組，例如選擇[0] .parentNode。

所以在你的情況下，var module = d3.select(".control").parentNode;應該工作。

Answer 3

您可以添加「最接近」 D3選擇的原型是這樣的：

d3.selection.prototype.closest = function(selector){ 
      var closestMatch = undefined; 
      var matchArr = []; 
      this.each(function(){ 
       var elm = this; 
       while(typeof elm.parentNode.matches === "function" && !closestMatch){ 
        elm = elm.parentNode; 
        if(elm.matches(selector)){ 
         closestMatch = elm; 
         matchArr.push(closestMatch); 
        } 
       } 
       closestMatch = undefined; 
      }); 
      return d3.selectAll(matchArr); 
     }