web-dev-qa-db-ja.com

jquery：クラス名で要素を取得し、それぞれにcssを追加します

同じクラス名を持つすべてのdivボックスがあります。私は彼ら全員に何かを適用しようとしていますが、運がありません。これまでに作成したコードは

$(document).ready(function(){
    elements = $('div.easy_editor');
    elements.each(function() { $(this).css("border","9px solid red"); });
    //elements[0].css("border","9px solid red");
});

私が間違っていることを教えてください

jqueryclass
22
Eugene

これを試すことができます

_ $('div.easy_editor').css({'border-width':'9px', 'border-style':'solid', 'border-color':'red'});
_

$('div.easy_editor')は、クラス簡易エディターが既にあるすべてのdivのコレクションを指します。 eachで実行したい機能がない限り、each（）を使用する必要はありません。 css（）メソッドは、実際に見つけたすべてのdivに適用されます。

41
Vincent Ramdhanie

JQueryを使いやすくするのは、各要素に属性を適用する必要がないことです。 jQueryオブジェクトには要素の配列が含まれ、jQueryオブジェクトのメソッドは配列内のすべての要素に同じ属性を適用します。

$(document).ready(function(){...})には、$(function(){...})の短縮形もあります。

だから、これはあなたが必要とするすべてです：

$(function(){
  $('div.easy_editor').css('border','9px solid red');
});

そのクラスを持つ任意の要素に対してコードを機能させたい場合は、タグ名なしでセレクターでクラスを指定するだけです。

$(function(){
  $('.easy_editor').css('border','9px solid red');
});
6
Guffa