Fabric.js addClass() 方法

Fabric.js addClass() 方法

使用Fabric.js的addClass()方法可以将指定的类添加到指定的HTML元素中。必须首先选择页面中的HTML元素才能使用此方法。

语法:

addClass(element, className)

参数: 此方法接受两个参数,如上所述并以下面所述进行描述:

  • element: 此参数用于指定要添加类的HTML元素。
  • className: 此参数用于指定要添加到元素的类。

下面的示例演示了Fabric.js中的 addClass() 方法:

示例:

<!DOCTYPE html> 
<html> 
  
<head> 
  
    <!-- Adding the Fabric.js library -->
    <script src= 
"https://cdnjs.cloudflare.com/ajax/libs/fabric.js/3.6.2/fabric.min.js"> 
    </script> 
  
    <style> 
      
        /* Define the CSS classes to be used */ 
        .box1 { 
            margin: 12px; 
            width: 100px; 
            height: 100px; 
            background-color: red; 
        } 
  
        .box2 { 
            margin: 12px; 
            width: 100px; 
            height: 100px; 
            background-color: green; 
        } 
  
        .border { 
            border: 5px dashed; 
        } 
    </style> 
</head> 
  
<body> 
    <h1 style="color: green;"> 
        GeeksforGeeks 
    </h1> 
    <h3> 
        Fabric.js util.addClass() Method 
    </h3> 
  
    <div id="box1">Box 1</div> 
    <div id="box2">Box 2</div> 
      
    <script> 
  
        // Select the element that has 
        // to be applied the classes 
        let elem = 
            document.querySelector('#box1'); 
        let elem2 = 
            document.querySelector('#box2'); 
  
        // Add the required classes 
        // to the element 
        fabric.util.addClass(elem, 'box1'); 
        fabric.util.addClass(elem, 'border'); 
  
        fabric.util.addClass(elem2, 'box2'); 
        fabric.util.addClass(elem2, 'border'); 
    </script> 
</body> 
  
</html>

输出:

Fabric.js addClass() 方法

Python教程

Java教程

Web教程

数据库教程

图形图像教程

大数据教程

开发工具教程

计算机教程