2

classNameインデックスがないと jQuery 内でプロパティが機能しないことに気付きました。なぜですか?

また、jQuery 内で期待どおりに動作しない他の一般的な JS プロパティ/メソッドはありますか?

HTML:

<div class="par">test</div>

JQuery:

$(function () {

    var el = $('.par');

    el.className += ' new class'; // doesn't work
    el[0].className += ' new class'; // works
});
4

6 に答える 6

10

var el = $('.par');jQuery オブジェクトを返します。jQuery objectではなくElementclassNameのプロパティです。

jQuery オブジェクトには配列のような定義があるため、 className プロパティを持つel[0]基本要素を返します。

私の知る限り、jQuery は開発者がそのプロパティを直接更新することを好みません。簡単に開発できるように、さまざまなユーティリティ関数を公開するだけです。

以下のDavid Thomasからの素敵なコメントを引用すると、

jQuery メソッドは jQuery オブジェクトでのみ使用できます。ネイティブ DOM プロパティ/メソッドは、ネイティブ DOM ノードでのみ使用できます

注: var el = $('.par'); Element のコレクションをel[0]返し、そのリストの最初の要素を返します。

.addClass要素にクラスを追加するために使用できます。

最初の要素に、

el.eq(0).addClass('new_class');

すべての要素に、

el.addClass('new_class');

もっと読む：

  1. https://developer.mozilla.org/en-US/docs/Web/API/element
  2. https://developer.mozilla.org/en-US/docs/DOM/element.className
于 2013-05-16T18:47:43.100 に答える
2

className は、DOM 要素の API の一部です。

var el = $('.par');要素の配列を持つ jQuery オブジェクトを返します。

Usingel[0]は、API にアクセスできる最初の要素にアクセスします。

jQuery は、addClass と呼ばれるセレクターによって一致する要素または要素のグループにクラスを追加するための簡単な方法を提供します。これを使用できます：

var el = $('.par');
el.addClass('new class');

また、通常は、jQuery オブジェクトを含む変数に次のように名前を付けることがベスト プラクティスであることに注意してください$。

var $el = $('.par');
于 2013-05-16T18:49:34.723 に答える
2 
var el = $('.par');

1 つ以上の DOM 要素を含むことができる jQuery オブジェクトを提供します。 

var el = $('.par')[0];

その jQuery オブジェクトの選択範囲内の最初の DOM オブジェクトを返します。 classNamejQuery オブジェクトではなく、DOM 要素のプロパティです

$('.par').attr('class');

最初の要素のclassNameを取得するjQueryの方法です。

別のクラスに一致する要素に特定のクラスを追加したいだけの場合は、次を使用できます

$('.par').addClass('testclass');

これにより、テスト クラスが par クラスを持つすべての要素に追加されますが、メソッドはそれをページの最初の要素にのみ追加します。

その他の特性

また、jQuery 内で期待どおりに動作しない他の一般的な JS プロパティ/メソッドはありますか?

ほとんどの dom プロパティは、jQuery オブジェクトでは直接機能しません。[0] を使用して、最初に一致した要素の生の dom 要素を取得できます。ただし、それらのほとんどは、jQuery にも直接同等のものがあります。jQuery バージョンを使用する利点は、多くの場合単純であり、ブラウザー間で一貫して動作することです。ただし、ネイティブ dom プロパティはアクセスが高速になる傾向があります。

于 2013-05-16T18:49:49.620 に答える
1

jQuery DOM オブジェクトは、実際には一致する要素のリストです。DOM 要素のリストに変数を設定しているため、jQuery はそれらをリスト全体に適用できません。el[0]最初に一致した要素です。(複数の要素がある場合、 usingel[0]は最初に一致した要素のみを設定し、一致する要素がない場合el[0]は ValueError を発生させます。) おそらく、jQuery の組み込みクラス操作関数を使用する必要があります。

el.addClass("new class");

クラスを削除するには:

el.removeClass("new class");

それらを切り替えるには：

el.toggleClass("new class");
于 2013-05-16T18:50:44.970 に答える
0

これは質問とは直接関係ないかもしれませんが、jQuery を使用している場合は、jQuery の使いやすいメソッドを使用して、jQuery オブジェクト内のすべての DOM 要素のクラス名を変更する必要もあります。

http://api.jquery.com/addClass/ http://api.jquery.com/toggleClass/ http://api.jquery.com/removeClass/

于 2013-05-16T18:50:55.570 に答える
0 
$(function () {

    var cname = $('.par').attr('class'); // get class attribute
    if (!$('.par').hasClass('some-new-class')) {
        $('.par').addClass('some-new-class');
    }
});
于 2013-05-16T18:51:55.373 に答える