セレクタ

複数の要素

 var h_tags = $('h1, h2, h3');

親子関係にある要素

 var lis = $('ul>li');

子孫関係ににある要素

 var inputs = $('form input);

リストになっている要素

 var first_li = $('li:first');           // リストの最初の要素
 var last_li  = $('li:last');            // リストの最後の要素
 var even_lis = $('li:even');            // リストの偶数番目の要素
 var odd_lis  = $('li:odd');             // リストの奇数番目の要素
 var third_li = $('li:eq(2));            // 添え字で指定する要素(添え字は0スタート)
 var lis      = $('li:contains("ABC")'); // 指定する文字列を持っている要素

親要素

 var elems = $('div').parent(); // divの子要素も含む

子要素

 var elems = $('div').children();

兄弟要素

 var lis = $('li').siblings()

前の要素

 var first_li = $('li:eq(1)').prev();

次の要素

 var third_li = $('li:eq(1)').next();

ある要素の中だけを対象にする

 var div = $('#div1');
 var elements = $('.foo', div);
 もしくは
 var elements = div.find('.foo');

カスタム疑似セレクター

 var arialDivs = [];
 $("div").each(function(){
   var div = $(this);
   if (div.css("font-family") === "Arial") {
       arialDivs.push(div);
   }
 });

 $.extend($.expr[":"], {
     hasArialFont: function (element) {
         return $(element).css("font-family") === "Arial";
     }
 });
 
 $("div:hasArialFont").click(function(){
     alert("Element has Arial font");
 });

参考


トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS

Last-modified: 2013-10-03 (木) 11:40:52