jQuery class属性值操作

上一章节介绍了一下内容：

$().attr(‘class’,值);

$().attr(‘class’);

$().removeAttr(‘class’); //删除class的属性

本节补充如下内容：

$().addClass(值); //给class属性追加信息值

$().removeClass(值); //删除class属性中的某个信息值

$().toggleClass(值); //开关效果，有就删除，没有就添加

<!DOCTYPE html>
<html>
    <head>
        <title>php.cn</title>
        <meta charset="utf-8" />
        <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
        <script>
            function f1(){
                $("div").addClass('s2');
            }
            function f2(){
                $("div").removeClass('s2');
            }
            function f3(){
                $("div").toggleClass('s2')
            }
        </script>
        <style type="text/css">
            .s2{
                width:250px;
                height:25px;
                background: yellow;
            }
        </style>
    </head>
    <body>
        <div class="s1">欢迎大家学习我们的jQuery课程</div>
        <input type="button" value="设置" onclick="f1()" />
        <input type="button" value="删除class的属性值" onclick="f2()" />
        <input type="button" value="开关class属性值的操作" onclick="f3()" />
    </body>
</html>

Weiter lernen

neue Datei

<!DOCTYPE html> <html> <head> <title>php.cn</title> <meta charset="utf-8" /> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <script> function f1(){ $("div").addClass('s2'); } function f2(){ $("div").removeClass('s2'); } function f3(){ $("div").toggleClass('s2') } </script> <style type="text/css"> .s2{ width:250px; height:25px; background: yellow; } </style> </head> <body> <div class="s1">欢迎大家学习我们的jQuery课程</div> <input type="button" value="设置" onclick="f1()" /> <input type="button" value="删除class的属性值" onclick="f2()" /> <input type="button" value="开关class属性值的操作" onclick="f3()" /> </body> </html>

einreichen Code zurücksetzen

Automatische Operation

jQuery class属性值操作

GrundschuleTutorial zur Imitation einer Imperial CMS-Unternehmenswebsite

GrundschuleNeulinge ohne WordPress-Grundkenntnisse erstellen persönliche Blogs und Unternehmenswebsites

GrundschuleUltimatives CMS-zertifiziertes Anleitungsvideo zum Erstellen von Websites

GrundschuleFront-End-Projekt-Shangyou [umfassende Praxis der HTML/CSS/JS-Technologie]

DazwischenliegendVue3.0 von 0 zum Aufbau einer universellen Backend-Managementsystem-Projektpraxis

GrundschuleNullbasierter Front-End-Kurs [Vue fortgeschrittenes Lernen und praktische Anwendung]

GrundschuleWEB-Frontend-Tutorial [HTML5+CSS3+JS]

GrundschuleKurze Einführung in Apipost

DazwischenliegendVue3 + TypeScript praktische Tutorial-Projektpraxis auf Unternehmensebene

GrundschuleLassen Sie uns kurz über die Gründung eines Unternehmens in PHP sprechen

DazwischenliegendVUE E-Commerce-Projekt (Front-End- und Back-End-Doppelprojekt, tatsächlicher Kampf)

GrundschulePraktische Anwendung von Apipost [API, Schnittstelle, automatisiertes Testen, Mock]