zoukankan      html  css  js  c++  java
  • 原生JS添加删除Class

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>JS原生添加删除Class</title>
    <style>
    #a{
    100px;
    height: 100px;
    color: aqua;
    text-align: center;
    line-height: 99px;
    background-color: #000000;
    }
    </style>
    </head>
    <body>
    <div id="a"></div>
    <script>
    function hasClass(obj, cls) {
    return obj.className.match(new RegExp('(\s|^)' + cls + '(\s|$)'));
    };
    function addClass(obj, cls) {
    if (!hasClass(obj, cls)) obj.className += " " + cls;
    }
    Object.prototype.removeClass = function removeClass(obj, cls) {
    if (hasClass(obj, cls)) {
    var reg = new RegExp('(\s|^)' + cls + '(\s|$)');
    obj.className = obj.className.replace(reg, ' ');
    }
    };
    function toggleClass(obj, cls) {
    console.log(this.hasClass)
    if (this.hasClass(obj, cls)) {
    this.removeClass(obj, cls);
    } else {
    this.addClass(obj, cls);
    }
    };
    var a = document.getElementById('a');
    toggleClass(a,'a');
    console.log(a.className);
    a.innerHTML = a.className;
    </script>
    </body>
    </html>
     
    学习地址:  https://www.cnblogs.com/lewayjack/p/6778016.html
    Dome地址:http://runjs.cn/code/foby1shi
  • 相关阅读:
    【CSS】盒子模型的计算
    【CSS】定义元素的位置
    【Jenkins】安装插件
    安装【Jenkins】
    Python【unittest】模块
    Python【pyyaml】模块
    CentOS下安装gcc和gdb
    汇编学习笔记(15)综合研究
    汇编学习笔记(14)BIOS对键盘输入的处理
    汇编学习笔记(13)直接定址表
  • 原文地址:https://www.cnblogs.com/DoubleLoong/p/8465493.html
Copyright © 2011-2022 走看看