人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

jqueryで、
以下のように記述すると、
$("ul li").each(function(i){
console.log(i);
});

<ul>
<li></li>
<li></li>
</ul
とあるhtmlでliが2つ取得できますが、
$("ul li a").click(function(){
$(this).parent().each(function(i){
console.log(i);
});
});
とするとliが1つしか取得できません。
後者ですとなぜ1つしかしゅとくできないのでしょうか。

●質問者: FujiiRock
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● a-kuma3
●100ポイント ベストアンサー
<ul>
<li><a href="...">いちばんめ</a></li>
<li><a href="...">にばんめ</a></li> <!-- ★ -->
</ul>

となってるところで、以下のようになってた場合。

$("ul li a").click(function(){
 $(this).parent().each(function(i){
 console.log(i);
 });
});

もし、「にばんめ」がクリックされたとしたら、

 $(this).parent().each(function(i){

thisクリックした「にばんめ」とある A タグの要素
$(this)↑の jQuery オブジェクト
$(this).parent()↑の親である LI タグの要素(★をつけたとこの LI )の jQuery オブジェクト

となり、一回だけです。

 $(this).parent().parent().children().each(function(i){

こうなってると、どうでしょうね。

thisクリックした「にばんめ」とある A タグの要素
$(this)↑の jQuery オブジェクト
$(this).parent()↑の親である LI タグの要素(★をつけたとこの LI )の jQuery オブジェクト
$(this).parent().parent()↑の親である UL タグの要素の jQuery オブジェクト
$(this).parent().parent().children()↑の子である LI タグの要素 全ての jQuery オブジェクト

となって、二回取得できます。


FujiiRockさんのコメント
なるほど。。勉強になりました!ありがとうございます!
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ