0

以下のコードを考えると、domで次の要素を見つけるにはどうすればよいですか？

<!-- START Main Navigation -->
<nav id="main-nav">
    <ul>
        <li>
            <a href="/">Home</a>    
            <ul>
                <li><a href="index.html">Layout 1</a></li>
            </ul>
        </li>
        <li>
            <a href="blog.html">Blog</a>
            <ul>
                <li><a href="blog.html">Blog</a></li>
            </ul>
        </li>
        <li>
        <a href="/Contact">Contact</a>
        </li>
    </ul>
</nav>
<!-- END Main Navigation -->

ホームを指すリンクを見つけて、その親class=activeに属性を適用したい <li>

これどうやってするの？

これは簡単な質問ですが、jqueryを学んでいます。また、コードには他にもあるので、どういうわけかselect<li><a href="/"....に組み込む必要があります。<nav id="main-nav-list">

最後に、連絡先やブログにいるときはいつでもこれを行う必要があります。

4

9 に答える 9

2 
$('#main-nav-list a').each(function () {
  if ($(this).text() == 'Home') $(this).parent().addClass('active');
});

jsFiddleの例

于 2013-01-07T05:10:53.220 に答える
1

これを試して、

$(document).ready(function() {
    $('#main-nav a').each(function () {
        if($(this).html()=='Home'){
            $(this).parent().attr('class','active');
        }
    });
});
于 2013-01-07T05:41:07.277 に答える
0

あなたはこのようなことをすることができるはずです：

$('#main-nav-list li').first().addClass('active');

他にもかなりの数の方法がありますが、うまくいけばそれは理にかなっています:)

ただし、「ホーム」が常に最初になると想定しています。

于 2013-01-07T05:05:16.777 に答える
0

これを実現する方法はたくさんありますが、以下の方法では、リンクテキストを照合して「ホーム」リンクを探します。

$('a:contains("Home")').addClass('active');

セレクターのドキュメントをご覧ください。

http://api.jquery.com/category/selectors/

于 2013-01-07T05:07:07.403 に答える
0 
$('ul#main-nav-list li > a.active').removeClass('active'); 
//First undo the current active :)

$('ul#main-nav-list li > a[href="/"]').addClass('active');  
//Then apply to the one you want

aプロパティにアクセスして、現在のウィンドウのURLを取得し、対応するタグを検索することもできwindow.location.hrefます。

于 2013-01-07T05:09:51.537 に答える
0

正確な文字列「Home」を持つ要素をターゲットにするだけの場合は、これを試してください。

$(document).ready(function() {
  $.each($("a"), function(index, node) {
         if($(node).html() == "Home") {
           $(node).parent("li").addClass("active");
         }
  });
});

JSFiddleの例：http ：//jsfiddle.net/dharmavir/uqT6J/

于 2013-01-07T05:22:10.373 に答える
0

フィルタ関数を使用してリンク内のテキストを正確に一致させる別の方法は次のとおりです。

http://jsfiddle.net/aWVJg/

$('#main-nav-list a').filter(
function () 
{
  return this.text === 'Home';
}).addClass('active');
于 2013-01-07T05:29:12.453 に答える
-1

これを行う：

$('ul#main-nav-list li:nth-child(1)').addClass('active')
于 2013-01-07T05:06:12.870 に答える
-3 
$('myElement').addClass();

失礼ではありませんが、 jQueryについて何か知っていますか？jQueryのホームページを見て、その方法を説明しています。APIも非常に役立ちます。

于 2013-01-07T05:05:27.207 に答える