0

クラスで同じクラス名の値の複数のインスタンスを取得するまで、いくつかの小さな追加/削除/トグル/クラス関数を作成しています。それらはすべて非常にうまく機能します。

これまでのところ、removeClass Regexp に「g」フラグがあることがわかります。

Element.prototype.hasClass = function (className) {
    return new RegExp('(\\s|^)' + className + '(\\s|$)').test(this.className);
};

Element.prototype.addClass = function (className) {
    if (!this.hasClass(className)) {
        this.className += ' ' + className;
    }
};

Element.prototype.removeClass = function (className) {
    if (this.hasClass(className)) {
        this.className = this.className.replace(new RegExp('(\\s|^)' + className + '(\\s|$)', 'g'), '$2');
    }
};

Element.prototype.toggleClass = function (className) {
    if (this.hasClass(className)) {
        this.removeClass(className);
    } else {
        this.addClass(className);
    }
};

開始 HTML:

<p class=" james james dean james james james">Hello</p>

レンダリング時:

<p class=" james dean james">Hello</p>

これが私の作業中の jsFiddle です。要素を調べると、すべてのjamesインスタンスが削除されているわけではありません。私が間違っていることについて誰かが光を当てることができますか? 前もって感謝します:) http://jsfiddle.net/8urPs/

4

4 に答える 4

0

これは、クラス名間のスペースは単一の一致の一部にしかならないためです。これを修正するには、次のように、最終的なキャプチャ グループを肯定的な先読みに置き換えることができます。

Element.prototype.removeClass = function (className) {
    if (this.hasClass(className)) {
        this.className = this.className.replace(new RegExp('(\\s|^)' + className + '(?=\\s|$)', 'g'), '');
    }
};
于 2013-11-08T10:27:20.797 に答える