myExtraContent1
myExtraContent2

 
Stacks Image 2215
要素の指定
要素を指定する方法
$('CSSセレクタ'[,基準とする要素]) CSSセレクタを用いる (実際例)
$('要素オブジェクト'[,基準とする要素]) 要素オブジェクトを用いる (実際例)
$('要素を表す文字列'[,基準とする要素]) 文字列で要素を表す (実際例)
[,基準とする要素]は省略可能、これが記述されたら、その要素に囲まれているものだけが指定される。
 CSSセレクタによる指定

要素を明示する実際例    (指定するhtmlを表示)

• $('div')        すべての div 要素を指定
• $('#content')
     id="content"属性を持つ要素を指定
• $('ul a')
       ul要素に内包されているa要素(子孫)を指定
• $('ul,h5')
       ul要素とh5要素の2つを指定
• $('div>h5')
      div要素の子要素にあたるh5要素を指定
• $('h5+p')
       h5要素の直後に位置するp要素(兄弟)を指定
• $('h5~p')
       h5要素より後に位置するp要素(兄弟)を指定
• $('div.entry')
     entryという名前のclass属性のあるdiv要素を指定


属性を明示する実際例    (指定するhtmlを表示)

• $('*[class]')      class属性のある要素を指定 '*[class]' は '[class]' でもよい
• $('*[class="item"]')
   class属性の値が"item"である要素を指定 上と同じ * はなくてもよい
• $('li[class!="item"]')
   class属性の値が"item"でないli要素を指定
• $('div[id^="ent"]')
    id属性の値が"ent"で始まるdiv要素を指定
• $('div[id$="layout"]')   id属性の値が"layout"で終わるdiv要素を指定
• $('*[id=*="-"]')     id属性の値に"-"が含まれている要素を指定  $('[id=*="-"]')でもよい
• $('*[class][id]')     classとidの両方の属性を持つ要素を指定  $('[class][id]')でもよい


フィルタ(filter)実際例    (指定するhtmlを表示)

• $('*:header')      h1,h2,h3…まど見出しの要素を指定    $(':header')でもよい
• $('h5:first')      最初のh5要素を指定
• $('div:not([id*="-"][class])')   id属性に"-"を含まずclass属性を持たないdiv要素を指定
• $('div:has(ul)')    子孫にul要素を持つdiv要素を指定
• $('li:eq(2)')      3番目のli要素を指定 最初のli要素はli:eq(0)
• $('tbody tr:even')      :evenフィルタは偶数番目を指定
• $('tbody tr:odd')      :oddフィルタは奇数番目を指定




myExtraContent3