0

例:

<ul id="nav1">
    <li><a href="page1.html">Page 1</a></li>
    <li class="active"><a href="page2.html">Page 2</a></li>
    <li><a href="page3.html">Page 3</a></li>
    <li><a href="page4.html">Page 4</a></li>
</ul>

この例では、現在ページ 2 にいます。ページ 2 に、Next Pageページ 3 への URL を持つボタンを配置します。

hrefページ 3 (JavaScript を使用)を取得するにはどうすればよいですか?

4

2 に答える 2

2

jQueryが使えるなら

$('.active').next('li').find('a').attr('href');  // page3.html

それ以外の場合は、プレーンな JavaScript で (フィドルの例: http://jsfiddle.net/gGRcX/2/ )

var ul   = document.getElementsById('nav1'),
    link = ul.querySelector('li.active + li a');

if (link) {   /* in case there's no "active" class 
               * (or if it's applied on last li element) 
               */
    console.log(link.href) // page3.html
}

querySelectorAll最新のすべてのブラウザーと IE8+ で動作します

于 2012-05-14T09:28:09.340 に答える
-1
$('#nav1 .active + li > a').attr('href');

CSS3 FTW :)

編集: CSS 2.x である可能性もありますが、チェックするのが面倒です。

于 2012-05-14T09:35:33.143 に答える