一款轻量级操作dom中class类的添加、删除、切换插件

一款轻量级操作dom中class类的添加、删除、切换插件

classie.js, 一个超级轻量级脚本, 它允许您很容易添加、删除、切换,和检查DOM中的class类。 

使用方式:

第一步引入 <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/classie.js"></script>

方法:

has 判断是否包含某个类

add 增加一个类

remove 删除一个类

toggle 切换一个类

示例代码:

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/classie.js"></script>
    <style>
        .my-class{
            background: red;
            font-size: 20px;
        }
        .my-new-class{
            background: blue;
        }
        .my-unwanted-class{
            font-size: 100px;
        }
    </style>
</head>

<body>
    <div id="picker" class="my-class my-unwanted-class">
        test
    </div>
    <script type="text/javascript">
        var element=document.getElementById("picker");
            classie.has( element, 'my-class' ) // returns true/false
        classie.add( element, 'my-new-class' ) // add new class
        classie.remove( element, 'my-unwanted-class' ) // remove class
        classie.toggle( element, 'my-class' ) // toggle class
    </script>
</body>

</html>

立即下载classie.js查看所有js插件

网友评论0

程序员在线工具箱