Fabric.js addClass()用法及代码示例

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

用法:

addClass(element, className)

参数：此方法接受上面提到并在下面描述的两个参数：

element:此参数用于指定必须在其上添加类的HTML元素。
className:此参数用于指定必须添加到元素的类。

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

例：

HTML


<!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>

输出：

相关用法

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