Как удалить атрибут класса из div?

Я использую JavaScript, и я хочу добавить/удалить атрибут Class, если нажата кнопка. Я могу добавить класс, но я не знаю, как его удалить. как я могу это сделать?

window.onload = function(){
    var buttonGo = document.getElementsByTagName('button')[0];
    var buttonCom = document.getElementsByTagName('button')[1];
    var box = document.getElementById('box');
    buttonGo.onclick = function(){
        box.setAttribute('class','move');
    }
    buttonCom.onclick = function(){
        // how to remove class name?
    }
}

Ответы

Ответ 1

box.removeAttribute("class") должен работать.

Ответ 2

Самый лучший способ установить классы с помощью Javascript - использовать свойство className:

// to add
box.className = 'move';
// to remove
box.className = '';

Ответ 3

function hasClass(ele,cls) {
    return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}
function addClass(ele,cls) {
    if (!this.hasClass(ele,cls)) ele.className += " "+cls;
}
function removeClass(ele,cls) {
    if (hasClass(ele,cls)) {
        var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
        ele.className=ele.className.replace(reg,' ');
    }
}

Вы можете использовать RegExp в тезисе три функции для проверки существования класса, добавления класса и удаления класса. Вот источник openjs

Ответ 5

В будущем-ish вы также можете рассмотреть Element.classList.

   var d = document.getElementsByTagName('div')[0];
   d.classList; // []
   d.classList.add('foo'); // undefined
   d.classList; // ["foo"]
   d.classList.remove('foo'); // undefined
   d.classList; // []

Я говорю, что будущее-иш b/c вам нужно рассмотреть этот IE < 10.

Ответ 6

Попробуйте следующее:

window.onload = function(){
            var buttonGo = document.getElementsByTagName('button')[0];
            var buttonCom = document.getElementsByTagName('button')[1];
            var box = document.getElementById('box');
            buttonGo.onclick = function(){
                box.setAttribute('class','move');
            }
            buttonCom.onclick = function(){
               box.className=''
            }
       }

или двойные кавычки box.className=""

Ответ 7

Поддержка кросс-браузера:

buttonCom.onclick = function() {
    box.className = ''; // IE
    box.removeAttribute('class'); // Others
};

Ответ 8

Вы должны рассмотреть jQuery, чем вы можете просто использовать это: $('.itemclass').removeClass('classname');