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

D3.js中的d3.style()函数用于为具有指定名称(值)的指定节点(属性)设置样式。在这种情况下，如果节点具有指定名称的内联样式，则返回其值，如果节点没有内联样式，则返回计算出的值。

用法:

d3.style(node, name)

参数：此函数接受上述和以下描述的两个参数：

node:这是所选元素的属性。
name:这是指定属性的值。

返回值：此函数返回具有指定名称(值)的指定节点(属性)的值样式属性。

以下示例说明了D3.js中的d3.style()函数
范例1：

html

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            D3.js | d3.style() Function 
        </title> 
  
        <script src= 
"https://d3js.org/d3.v4.min.js"> 
        </script> 
    </head> 
  
    <body> 
        <p style="color:green;"> 
          GeeksforGeeks 
        </p> 
  
        <p style="color:green;"> 
          A computer science portal for geeks 
        </p> 
  
        <script> 
            
            // Calling the style() function 
            d3.select("p").style("color", "red"); 
        </script> 
    </body> 
</html>

输出：

范例2：

html

<!DOCTYPE html> 
<html> 
    <head> 
        <title> 
            D3.js | d3.style() Function 
        </title> 
  
        <script src= 
"https://d3js.org/d3.v4.min.js"> 
        </script> 
    </head> 
  
    <body> 
        <p style="color:green;"> 
          GeeksforGeeks 
        </p> 
  
  
        <p style="color:green;"> 
          A computer science portal for geeks 
        </p> 
  
        <script> 
            // Calling the style() function 
            d3.select("p").style("font-size", "40px"); 
        </script> 
    </body> 
</html>

输出：

相关用法

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