jquery - 特定の要素jqueryを見つける

Question

さて、私はこのhtmlを持っています：

<div id="tabs">
<div class="selected"><a href="one"></a></div>
<div><a href="two"></a></div>
<div><a href="three"></a></div>
</div>

リンクを含むクラスが選択されたdivが1つしかありません。私が見つけたいのは、その後の最初のリンクなので、このjqueryを試しました

var $newTab = $('#tabs div.selected a').find('a').eq(0).attr("href");
alert($newTab);

undefined を返します。次の a 要素の href を見つけるにはどうすればよいですか?

私もこれを試しました：

var $newTab = $('#tabs div.selected').find('a').eq(0).attr("href");
alert($newTab);

1つ返されたので、.eq()を変更してみました:

var $newTab = $('#tabs div.selected').find('a').eq(1).attr("href");
alert($newTab);

ただし、結果は未定義に戻ります。

Answer 1

.selectedクラスの次の div を見つけたい場合は、.next()を使用できます

var $newTab = $('div.selected').next().find('a').attr("href");

デモフィドル

Answer 2

選択した div を取得し、その.next兄弟を見つけてアンカー タグを取得します。

$('#tabs div.selected').next().find("a").attr("href")

JSFiddle

1つのセレクターでそれを行うこともできます

$('#tabs div.selected + div a').attr("href");

これ+は兄弟セレクターです

JSFiddle

Answer 3

私の理解が正しければ、選択したリンクの次のリンクが必要です。

eq の代わりにnext()を試してください:

$('#tabs').find('.selected').next().find('a').attr('href');

または .next().next() その後の1つ：

$('#tabs').find('.selected').next().next().find('a').attr('href');

eq(0)、divタグにアンカーが1つしかないため、テストでは機能したのは1つだけでした。それは実際には不要です。

Answer 4

最初の項目を取得するには、eq(n) の代わりに first() を使用します。

var $newTab = $('div.selected').find('a').first().attr("href");
alert($newTab);

選択されているアイテムは 1 つだけなので、インデックスを使用して取得する必要はありません。これも機能するはずです。

var $newTab = $('div.selected').find('a').attr("href");
alert($newTab);

Answer 5

これを試して

var result = $('div.selected').next().find('a').attr('href');