要素を「+」で区切って記述することで、前要素の直後にある要素を選択します。直後の要素が1つしか選択されないことに注意してください。~(後要素)を利用します。条件が厳しいので利用頻度は低いかもしれません。直後の要素しか調べないため処理速度は高速です。直後にある要素を選択サンプル(next-adjacent/01.html)を開いてbody内の構成を確認して下さい。h1要素の後にp要素が3つあります。jQueryは以下の様に記述され、buttonをクリックするとh1要素の直後のp要素だけが選択されます。cssメソッドで赤枠を表示します。red");});結果として、buttonをクリックすると最初のp要素だけに赤枠が表示されます。対象は同じ階層の要素のみ+(直近の後要素)では前要素と後要素が同じ階層でなければいけません。サンプル(next-adjacent/01b.html)を開いてbody内の構成を確認してください。以下の様にdiv要素でp要素を囲み、p要素の階層が変わりました。jQueryはnext-adjacent/01.htmlと同じです。</p></div>その結果、buttonをクリックしてもp要素は何も選択されません。指定した要素が直後にないといけません後要素として設定した要素は前要素の直後にないといけません。サンプル(next-adjacent/01c.html)を開いてbody内の要素を確認して下さい。以下の様にh1要素とp要素の間にh2要素が追加され、h1要素の直後にp要素が存在していません(jQueryはnext-adjacent/01.htmlと同じです)。</p>その結果、buttonをクリックしてもp要素は選択されません。*(すべて)を利用すると良いでしょう。サンプル(next-adjacent/02.html)を開いてbody内の構成を確認して下さい。h1要素は2つあり、最初のh1要素の直後にはh2要素、次のh1要素の直後にはp要素があります。jQueryは以下の様に記述したので、h1要素の直後であれば要素の種類を問わず選択されます。red");});結果として、buttonをクリックするとh1要素の直後にあるh2要素とp要素が選択され、赤枠が表示されます。nextメソッドを利用すれば「+(直近の後要素)」と同じようなことが可能です。サンプル(next-adjacent/test01.html)を開いてhtmlの構成がnext-adjacent/01.htmlと同じ事を確認してください。nextメソッドでh1要素の直後にあるp要素を選択します。red");})結果としてnext-adjacent/01.htmlと全く同じになります。nextメソッドのページの「個人的なメモ」の項目を確認してください。