jQueryを使用して親クラスへの参照によってクラス名を変更する

Question

クラス名を削除する方法についていくつかの助言といくつかの提案がありました。

Previous answer

これらはフィドルで働いていたが、私のアプリケーションは少しだけ異なっています。私は、次のを持っている：私は「」とクラス名を置き換えるの最後の二つの方法を試してみましたが、両方は私にエラーを与える

if (action == "Edit") { 
    var parent = linkObj.closest("tr"); 
    parent.find(".refType").html($("#Type :selected").text()); // 1 
    parent.find(".refType").className.replace(/indent_\d+($|\s)/, "xxx"); 
    parent.find(".refType").trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 

に：

<span id="refType_1" class="refType indent_02">Link Header</span> 

私のjavascriptのは、このようになります。たとえば、最後の方法では次のようになります。

SCRIPT438: Object doesn't support property or method 'trim' 

私は99％稼働に向かっていると思っていますが、アドバイスをいただければと思います。これまでのところいくつかの方法を試してみましたが、それでも動作しません。

コメント// 1の行が機能することに注意してください。私は必要に応じてスパンの内容を変更することができます。どのような動作しないことです：

parent.find(".refType").className.replace(/indent_\d+($|\s)/, "xxx"); or 
parent.find(".refType").trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 

これらはテキストindent_xxをスパンから削除するために取得する私の二つの異なる試みています。

Answer 1

前の回答のコードを正しく実装していませんでした。

.classNameはないjQueryオブジェクトの、DOMオブジェクトのプロパティであり、あなたも、何にも .replace()の結果を代入していないので、あなたはこれらのいずれかを行うことはできません

：あなたは、以下の場合は

parent.find(".refType").className.replace(/indent_\d+($|\s)/, "xxx"); 
parent.find(".refType").trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 

あなたは.refType除いて維持したい、これらのオブジェクトには、他のクラスが存在しないわかっている場合、あなたはそれがさらに簡単に行うことができます

parent.find(".refType").each(function() { 
    this.className = $.trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 
}); 

：前の回答からデザインパターンは、あなたはこれを使用し

これはクラス名全体を「refType」に設定するだけで、そこにあったかもしれない他のクラスを排除します。

あなたはまた、jQueryのプラグインを使用すると、初期化コードのどこかに置くことを作ることができます：

parent.find(".refType").removeIndentClasses(); 

Answer 2

主な問題は次のとおりです。次に

$.fn.removeIndentClasses = function() { 
    this.each(function() { 
     this.className = $.trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 
    }); 
    return this; 
} 

、あなたのコードは、まさにこのことだろうjQueryオブジェクト用に定義されていないプロパティにアクセスしようとしています。 classNameの場合はDOM要素で使用でき、trimの場合は文字列（ブラウザがサポートしている場合）で使用できます。

コードをすべて.refType要素に適用することを前提としています。その場合は：

parent.find(".refType").each(function() { 
    this.className = $.trim(this.className.replace(/(^|\s)indent_\d+($|\s)/, " ")); 
}).html($("#Type :selected").text()); 

これはparent.findで始まる3行を置き換える必要があります。 eachループ内では、thisはjQueryオブジェクトではなくDOM要素を参照するため、classNameプロパティを持ちます。

className（this.className = newClassName）の値を変更するのではなく、実際に値を設定する必要があります。

jQueryの$.trim関数は、以前のブラウザではネイティブのtrim関数をサポートしていないため、使用しています。

編集は（コメントを参照）

私はあなたが何を意味するかあなたのコメントからだと思うが唯一の.refType要素であり、したがって、あなたがeachループを使用したくないということです。あなたはget法や配列のインデックスのいずれかを使用してjQueryオブジェクトから基本となるDOM要素にアクセスすることができます。

parent.find(".refType")[0].className = newClassName; 

Answer 3

トリムのためのあなたの構文が間違っている - それは、jQueryの名前空間に保存されている機能ではなく、jQueryの方法です。また、replaceは変更関数ではありません（元の文字列を変更するのではなく、新しい文字列を作成します）。最後に、classNameはDOMノードで定義されたプロパティですが、DOMノードのjQueryラッパーでは定義されていないため、jQueryコレクションに格納されている最初のDOMノードを取得して実際のDOMノードを取得する必要があります。

parent.find(".refType")[0].className = parent.find(".refType")[0].className.replace(/(^|\s)indent_\d+($|\s)/, " "); 

は（ほぼ確実に通常ほとんどのアプリケーションへの影響はありません。クラス名に空白を末尾としてとにかく必要はありません）トリミングなしで動作します。しかし、あなたが本当に空白をトリムしたい場合は、