id="a"いくつかのグループから、任意の数のクラスを関連付けることができるdiv があります。各グループには特定のプレフィックスがあります。JavaScript では、グループのどのクラスが div にあるのかわかりません。特定のプレフィックスを持つすべてのクラスをクリアしてから、新しいクラスを追加できるようにしたいと考えています。「bg」で始まるすべてのクラスを削除したい場合、どうすればよいですか? このようなものですが、実際には機能します：
$("#a").removeClass("bg*");
単語境界での正規表現分割\bは、これに対する最良の解決策ではありません。
var prefix = "prefix";
var classes = el.className.split(" ").filter(function(c) {
return c.lastIndexOf(prefix, 0) !== 0;
});
el.className = classes.join(" ").trim();
またはjQuery mixinとして：
$.fn.removeClassPrefix = function(prefix) {
this.each(function(i, el) {
var classes = el.className.split(" ").filter(function(c) {
return c.lastIndexOf(prefix, 0) !== 0;
});
el.className = $.trim(classes.join(" "));
});
return this;
};
2018 ES6 アップデート:
const prefix = "prefix";
const classes = el.className.split(" ").filter(c => !c.startsWith(prefix));
el.className = classes.join(" ").trim();
jQuery では、実際の DOM 要素はインデックス 0 にあり、これは機能するはずです
$('#a')[0].className = $('#a')[0].className.replace(/\bbg.*?\b/g, '');
ワイルドカード クラスの削除を行う単純なjQuery プラグイン alterClassを作成しました。オプションでクラスも追加します。
$( '#foo' ).alterClass( 'foo-* bar-*', 'foobar' )
これを処理するために jQuery 固有のコードは必要ありません。正規表現を使用してそれらを置き換えるだけです：
$("#a").className = $("#a").className.replace(/\bbg.*?\b/g, '');
任意のプレフィックスをサポートするようにこれを変更できますが、RegExp は 1 回だけコンパイルされるため、より高速な方法は上記のとおりです。
function removeClassByPrefix(el, prefix) {
var regx = new RegExp('\\b' + prefix + '.*?\\b', 'g');
el.className = el.className.replace(regx, '');
return el;
}
の2 番目の署名を使用$.fn.removeClass:
// Considering:
var $el = $('<div class=" foo-1 a b foo-2 c foo"/>');
function makeRemoveClassHandler(regex) {
return function (index, classes) {
return classes.split(/\s+/).filter(function (el) {return regex.test(el);}).join(' ');
}
}
$el.removeClass(makeRemoveClassHandler(/^foo-/));
//> [<div class="a b c foo"></div>]
単純な jQuery コンストラクトと配列処理関数を使用して使用するアプローチは、コントロールの ID とクラスのプレフィックスを取得し、すべてのクラスを削除する関数を宣言することです。コードが添付されています：
function removeclasses(controlIndex,classPrefix){
var classes = $("#"+controlIndex).attr("class").split(" ");
$.each(classes,function(index) {
if(classes[index].indexOf(classPrefix)==0) {
$("#"+controlIndex).removeClass(classes[index]);
}
});
}
この関数は、ボタンの onclick またはコードから、どこからでも呼び出すことができます。
removeclasses("a","bg");
http://www.mail-archive.com/jquery-en@googlegroups.com/msg03998.html言います:
...そして .removeClass() はすべてのクラスを削除します...
わたしにはできる ;）
乾杯
まったく同じ問題の解決策を探していました。プレフィックス "fontid_" で始まるすべてのクラスを削除するには この記事を読んだ後、私は現在使用している小さなプラグインを作成しました。
(function ($) {
$.fn.removePrefixedClasses = function (prefix) {
var classNames = $(this).attr('class').split(' '),
className,
newClassNames = [],
i;
//loop class names
for(i = 0; i < classNames.length; i++) {
className = classNames[i];
// if prefix not found at the beggining of class name
if(className.indexOf(prefix) !== 0) {
newClassNames.push(className);
continue;
}
}
// write new list excluding filtered classNames
$(this).attr('class', newClassNames.join(' '));
};
}(fQuery));
使用法：
$('#elementId').removePrefixedClasses('prefix-of-classes_');
私はそれが古い質問であることを知っていますが、新しい解決策を見つけて、それが不利な点があるかどうか知りたいですか?
$('#a')[0].className = $('#a')[0].className
.replace(/(^|\s)bg.*?(\s|$)/g, ' ')
.replace(/\s\s+/g, ' ')
.replace(/(^\s|\s$)/g, '');
Prestaul の回答は役に立ちましたが、私にはうまくいきませんでした。ID でオブジェクトを選択する jQuery の方法が機能しませんでした。私は使用しなければならなかった
document.getElementById("a").className
それ以外の
$("#a").className
(function($)
{
return this.each(function()
{
var classes = $(this).attr('class');
if(!classes || !regex) return false;
var classArray = [];
classes = classes.split(' ');
for(var i=0, len=classes.length; i<len; i++) if(!classes[i].match(regex)) classArray.push(classes[i]);
$(this).attr('class', classArray.join(' '));
});
})(jQuery);
クラス名にもハイフン「-」と数字を使用しています。したがって、私のバージョンには「\ d-」が含まれています
$('#a')[0].className = $('#a')[0].className.replace(/\bbg.\d-*?\b/g, '');
$("#element").removeAttr("class").addClass("yourClass");