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。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。