タイトル: .find()
この本文には実行可能なタグ等が含まれるため、安全のためHTMLソースとして表示しています。本文データは変更していません。
<p><u><span style="color:#f39c12"><strong><span style="font-size:18px">.find() </span></strong></span></u></p>
<p><span style="font-size:14px"><strong>・jQueryオブジェクトで指定した要素のうち、指定した条件に合致する子孫要素を選択する。</strong></span></p>
<p> </p>
<p><span style="font-size:16px"><span style="color:#16a085"><strong>■.find( selector )</strong></span></span></p>
<p><span style="font-size:14px">戻り値:jQuery</span></p>
<table>
<tbody>
<tr>
<th style="background-color:#ccffcc"><strong><span style="font-size:14px">引数</span></strong></th>
<th style="background-color:#ccffcc"><strong><span style="font-size:14px">説明</span></strong></th>
</tr>
<tr>
<td style="background-color:#eeeeee"><strong><span style="font-size:14px">selector</span></strong></td>
<td style="background-color:#eeeeee"><strong><span style="font-size:14px">検索対象をセレクタで指定</span></strong></td>
</tr>
</tbody>
</table>
<p> </p>
<p> </p>
<p><span style="color:#16a085"><strong><span style="font-size:16px">■.find( jQuery object ) </span></strong></span></p>
<p><span style="font-size:14px">戻り値:jQuery</span></p>
<table>
<tbody>
<tr>
<th style="background-color:#ccffcc"><span style="font-size:14px">引数</span></th>
<th style="background-color:#ccffcc"><span style="font-size:14px">説明</span></th>
</tr>
<tr>
<td style="background-color:#eeeeee"><span style="font-size:14px"><strong>jQuery object</strong></span></td>
<td style="background-color:#eeeeee"><span style="font-size:14px"><strong>検索対象をjQueryオブジェクトで指定</strong></span></td>
</tr>
</tbody>
</table>
<p> </p>
<p> </p>
<p><span style="color:#16a085"><strong><span style="font-size:16px">■.find( element )</span></strong></span></p>
<p><span style="font-size:14px">戻り値:jQuery</span></p>
<table>
<tbody>
<tr>
<th style="background-color:#ccffcc"><span style="font-size:14px">引数</span></th>
<th style="background-color:#ccffcc"><span style="font-size:14px">説明</span></th>
</tr>
<tr>
<td style="background-color:#eeeeee"><span style="font-size:14px"><strong>element</strong></span></td>
<td style="background-color:#eeeeee"><span style="font-size:14px"><strong>検索対象をDOM要素で指定</strong></span></td>
</tr>
</tbody>
</table>
<p> </p>
<p> </p>
<p><strong><span style="font-size:14px">使用例）</span></strong></p>
<p><span style="color:#2980b9"><strong><span style="font-size:14px">HTML</span></strong></span></p>
<table border="0" cellpadding="1" cellspacing="1" style="width:50%">
<tbody>
<tr>
<td style="background-color:#eeeeee">
<p><span style="font-size:14px"><strong>"<!DOCTYPE html></strong></span></p>
<p><span style="font-size:14px"><strong><html> </strong></span></p>
<p><span style="font-size:14px"><strong><head> </strong></span></p>
<p><span style="font-size:14px"><strong> <meta charset="utf-8"> </strong></span></p>
<p><span style="font-size:14px"><strong> <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> </strong></span></p>
<p><span style="font-size:14px"><strong> <script></strong></span></p>
<p><span style="font-size:14px"><strong> $(function(){</strong></span></p>
<p><span style="font-size:14px"><strong> <span style="color:#c0392b">$("p")</span><span style="color:#16a085">.find("span"</span><span style="color:#c0392b">).css("color","red"); </span></strong></span></p>
<p><span style="font-size:14px"><strong><span style="color:#c0392b"> }); </span></strong></span></p>
<p><span style="font-size:14px"><strong> </script> </strong></span></p>
<p><span style="font-size:14px"><strong></head> </strong></span></p>
<p><span style="font-size:14px"><strong><body> </strong></span></p>
<p><span style="font-size:14px"><strong> <p>黒<span style="color:#2980b9"><span>赤</span></span>黒<span style="color:#2980b9"><span>赤</span></span></p> </strong></span></p>
<p><span style="font-size:14px"><strong></body></strong></span></p>
<p><span style="font-size:14px"><strong></html>"</strong></span></p>
</td>
</tr>
</tbody>
</table>
<p><strong><span style="font-size:14px">pタグで要素を絞り、findメソッドでspanタグを指定し、さらに要素を絞る。</span></strong></p>
<p><span style="font-size:14px">pタグ内<span style="color:#2980b9">の<u><strong>spanタグ内にのみ処理が適応される。</strong></u></span></span></p>
<p> </p>
<p> </p>
<p> </p>
<p><br />
</p>
<p> </p>