javascript - 関数 - jquery 追加した要素 削除




JavaScriptを持つ要素からCSSクラスを削除する(jQueryは不要) (9)

この質問には既に回答があります:

誰も私にJavaScriptを使って要素のクラスを削除する方法を教えてもらえますか? 私はそれを使用することができないので、私にjQueryの答えを与えないでください、そして私はそれについて何も知らない。


編集

さて、完全に書き直してください。 それはしばらくして、私は少し学んだし、コメントが助けてきました。

Node.prototype.hasClass = function (className) {
    if (this.classList) {
        return this.classList.contains(className);
    } else {
        return (-1 < this.className.indexOf(className));
    }
};

Node.prototype.addClass = function (className) {
    if (this.classList) {
        this.classList.add(className);
    } else if (!this.hasClass(className)) {
        var classes = this.className.split(" ");
        classes.push(className);
        this.className = classes.join(" ");
    }
    return this;
};

Node.prototype.removeClass = function (className) {
    if (this.classList) {
        this.classList.remove(className);
    } else {
        var classes = this.className.split(" ");
        classes.splice(classes.indexOf(className), 1);
        this.className = classes.join(" ");
    }
    return this;
};

オールドポスト 私はちょうどこのようなもので働いていた。 ここに私が思いついた解決策があります...

// Some browsers don't have a native trim() function
if(!String.prototype.trim) {
    Object.defineProperty(String.prototype,'trim', {
        value: function() {
            return this.replace(/^\s+|\s+$/g,'');
        },
        writable:false,
        enumerable:false,
        configurable:false
    });
}
// addClass()
// first checks if the class name already exists, if not, it adds the class.
Object.defineProperty(Node.prototype,'addClass', {
    value: function(c) {
        if(this.className.indexOf(c)<0) {
            this.className=this.className+=' '+c;
        }
        return this;
    },
    writable:false,
    enumerable:false,
    configurable:false
});
// removeClass()
// removes the class and cleans up the className value by changing double 
// spacing to single spacing and trimming any leading or trailing spaces
Object.defineProperty(Node.prototype,'removeClass', {
    value: function(c) {
        this.className=this.className.replace(c,'').replace('  ',' ').trim();
        return this;
    },
    writable:false,
    enumerable:false,
    configurable:false
});

これで、 myElement.removeClass('myClass')呼び出すことができます。

またはチェーンしますmyElement.removeClass("oldClass").addClass("newClass");



これらの答えはすべて、あまりにも複雑すぎます。

var string = "Hello, whats on your mind?";
var new_string = string.replace(', whats on your mind?', '');

結果は文字列の戻り値になります

Hello

超簡単。 クレジットはjondavidjohnに行くJavascriptで文字列の部分を削除する



私はこのJSスニペットコードを使用します:

まず、すべてのクラスに到達し、ターゲットクラスのインデックスに従ってclassName = ""を設定します。

Target = document.getElementsByClassName("yourClass")[1];
Target.className="";

試してください:

function removeClassName(elem, name){
    var remClass = elem.className;
    var re = new RegExp('(^| )' + name + '( |$)');
    remClass = remClass.replace(re, '$1');
    remClass = remClass.replace(/ $/, '');
    elem.className = remClass;
}

document.getElementById("MyID").className =
    document.getElementById("MyID").className.replace(/\bMyClass\b/,'');

MyIDは要素のID、MyClassは削除するクラスの名前です。

UPDATE: "My-Class"のようにダッシュ文字を含むクラス名をサポートするには、

document.getElementById("MyID").className =
  document.getElementById("MyID").className
    .replace(new RegExp('(?:^|\\s)'+ 'My-Class' + '(?:\\s|$)'), ' ');

document.getElementById("whatever").className += "classToKeep";

既存のクラスを上書きするのではなく、クラスを追加するプラス記号( '+')


var element = document.getElementById('example_id');
var remove_class = 'example_class';

element.className = element.className.replace(' ' + remove_class, '').replace(remove_class, '');




css