クラスをつけたり消したり

function hasClass(elm, _class) {
    if(!elm || !_class) return;
//    var regexp = new RegExp('\\b'+ _class + '\\b'); // \ をエスケープしないと駄目なことを知らずにはまった
//    var regexp = new RegExp('(^|[^\\w-])' + _class + '([^\\w-]|$)');
    var regexp = new RegExp('(^|\\s)' + _class + '(\\s|$)'); // 単純にこれでいける?
    return regexp.test(elm.className);
}

function addClass(elm, _class) {
    if(!elm || !_class) return;
    if(!hasClass(elm, _class)) {
        elm.className += ! elm.className ? _class  : ' ' + _class;
    }
}

function removeClass(elm, _class) {
    if(!elm || !_class) return;
    if(hasClass(elm, _class)) {
        elm.className = elm.className.replace(new RegExp(_class, 'g'), '')
                                     .replace(/\s+/g, ' ')
                                     .replace(/^\s|\s$/, '');
    }
}

JsUnit を使うために書いてみた。

JsUnit 用の テストコード

function testHasClass() {
    var el = document.createElement('div');
    el.className = 'hoge fuga foobar foo-bar';
    assert(hasClass(el, 'hoge'));
    assert(hasClass(el, 'fuga'));
    assertFalse(hasClass(el, 'foo'));
    assertFalse(hasClass(el, 'bar'));
    assertFalse(hasClass(el, 'oge'));
}
function testAddClass() {
    var el = document.createElement('div');
    addClass(el, 'hoge');
    assert(el.className == 'hoge');
    addClass(el, 'fuga');
    assert(el.className == 'hoge fuga');
    addClass(el, 'hoge');
    assert(el.className == 'hoge fuga');
}
function testRemoveClass() {
    var el = document.createElement('div');
    el.className = 'hoge fuga foobar fuga';
    assert(el.className == 'hoge fuga foobar fuga')
    removeClass(el, 'fuga');
    assert(el.className == 'hoge foobar');
    removeClass(el, 'hage');
    assert(el.className == 'hoge foobar');
    removeClass(el, 'hoge');
    assert(el.className == 'foobar');
}

JsUnit については JsUnit を使った JavaScript のユニットテスト - WebOS Goodies が詳しい。

追記

hasClass 駄目だな。クラス名に "foo-bar" が含まれているとき "bar" or "foo" でも true が返ってくる。

追記 2

とりあえず "-" ハイフン問題は大丈夫になった。他の文字にも対応すべきだろうけどパス。

追記 3

正規表現修正。単純になったけど、これで大丈夫かしら。テストの意味が…。