如何使用jQuery或Javascript获得类名

Question

我想制作一个Javascript函数，在其中读取所选元素的类并添加active类。 如何获取函数所在的HTML元素的类？

我试图用document.getElementsByClassName(class)来创建Javascript函数，但这不起作用。

 function menuicon(){ var className = $('div').attr('class'); className.$(className).addClass("active"); } 

 <section class="menubar"> <div class="menuicon" onclick="classAdd()"> <span></span> <span></span> <span></span> </div> </section> <section class="home"> <button class="hbutton" onclick="classAdd()"></button> </section> 

我希望Javascript函数能读出放置函数的HTML元素的类。

Answer 1

您需要将元素传递给函数：

onclick="classAdd(this)"

然后在函数中，只需使用.addClass ，而无需使用className 。

function classAdd(element) {
    $(element).addClass("active");
}

Answer 2

此代码段仅在div的classList中包含“ active”

var classAdd = function() {
                  var menuIcon = document.querySelector('div.menuicon');
                      menuIcon.addEventListener('click',() => {
                                                    menuIcon.classList.add('active');
                                                 });
                          }

Answer 3

如果需要，请坚持使用div和menuicon类。 下面的代码将为您正常工作。

function classAdd() {
    $("div.menuicon").attr("class", "menuicon active");
}