当前位置: 首页>>代码示例 >>用法及示例精选 >>正文


d3.js matcher()用法及代码示例


d3.js中的d3.matcher()函数用于返回根据元素而返回true或false的函数。如果元素匹配,则返回true,否则返回false。

用法:

d3.matcher(selector);

参数:above-given函数仅采用上面给出并在下面描述的一个参数:

  • selector:选择器是要匹配的HTML标记的名称。

返回值:该函数返回一个返回布尔值的函数。

下面给出的是上面给出的函数的一些例子。



范例1:

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport"
            path1tent="width=device-width,  
                    initial-scale=1.0">  
    <title>Document</title>  
</head>  
<style> 
    h5{ 
        line-height:5px; 
    } 
</style>  
<body>   
    <div> 
  
    </div> 
    <div> 
        <h5>This is text1</h5> 
        <h5>This is text2</h5> 
        <h5>This is text3</h5> 
        <h5>This is text4</h5> 
    </div> 
  <script src =  
"https://d3js.org/d3.v4.min.js">  
  </script> 
  <script> 
    var heading= d3.selectAll("h5"); 
    var matcher=heading.filter(d3.matcher("h5")) 
                       .node(); 
    var filter=heading.filter(d3.matcher("h5")) 
                      .node(); 
    console.log(matcher); 
    console.log(filter); 
  </script>  
</body>  
</html>

输出:

范例2:

<!DOCTYPE html>  
<html lang="en">  
<head>  
    <meta charset="UTF-8">  
    <meta name="viewport"
            path1tent="width=device-width,  
                    initial-scale=1.0">  
    <title>Document</title>  
</head>  
<style> 
    p{ 
        line-height:5px; 
    } 
</style>  
<body>   
    <div> 
  
    </div> 
    <div> 
        <p>This is text1</p> 
        <p>This is text2</p> 
        <p>This is text3</p> 
        <p>This is text4</p> 
    </div> 
  <script src =  
"https://d3js.org/d3.v4.min.js">  
  </script> 
</script> 
  <script> 
    var heading= d3.selectAll("p"); 
    var matcher=heading.filter(d3.matcher("p")) 
                       .nodes(); 
    var filter=heading.filter(d3.matcher("p")) 
                      .nodes(); 
    // Matcher and filter are same and equal 
    console.log(matcher); 
    console.log(filter); 
    // Matcher and filter are same and equal so it returns true 
    console.log(matcher[0]==filter[0]) 
  </script>  
</body>  
</html>

输出:




相关用法


注:本文由纯净天空筛选整理自tarun007大神的英文原创作品 D3.js matcher() Function。非经特殊声明,原始代码版权归原作者所有,本译文未经允许或授权,请勿转载或复制。