navが外部ファイルにあるときにjQueryを使用してnav ul liにクラスを追加する方法は？

Question

私は左側にナビゲーション付きのダッシュボードを持っています。ナビゲーションはnav.htmlという名前の外部ファイルで宣言されます。すべてのページで

私はこれを使用してjQueryのを使用してnavigatoinをロード：

<script> 
    $(function() { 
     $.get("nav.html", function (data) { 
     $("nav").append(data); 
     }); 
    }); 
    </script> 

今、私は、能動素子にクラスを追加すると、私は方法を見つけることができませんでしたしてみてください...

あなたの助けをありがとう。

Answer 1

あなたはnav.htmlという構造を表示していませんが、どの要素をアクティブにするべきかを知っていると思います。一つの可能​​なアプローチ：

$.get("nav.html", function(navHtml) { 
    var $navHtml = $(navHtml); 
    var $activeLink = $navHtml.find('a[href="' + getActiveLink() + '"]'); // for example 
    $activeLink.addClass('active'); 
    $("nav").append($navHtml); 
}); 

ポイントはまだwindow.documentに付着していないHTML要素をラップjQueryオブジェクトを作成している - この要素はhtmlファイルの解析から作成されます。このオブジェクトをDOMの「実際のもの」と同じように処理することができます。具体的には、.find()メソッドで特定の要素を見つけてから、.addClass()でその要素に特定のクラスを追加します。

Answer 2

追加した後、要素を変更できるはずです。ところで、​​を使用して$.getと.html()を組み合わせることができます。コールバック関数のthisは、HTMLをロードしたnav要素になるため、これを使用してDOM要素を検索できます。

$("nav").load("nav.html", function() { 
    $(this).find("a").addClass("active"); 
});