在前端開發(fā)中我們經(jīng)常需要使用導航菜單，但是手寫一遍導航菜單的代碼比較麻煩，這時候jQuery提供了一個很方便的方法——遍歷。通過遍歷，我們可以輕松地生成導航菜單，以下是一個簡單的示例。

<div id="menu">
<ul>
<li>首頁</li>
<li>新聞資訊
<ul>
<li>國內新聞</li>
<li>國際新聞</li>
</ul>
</li>
<li>產(chǎn)品中心
<ul>
<li>產(chǎn)品分類1</li>
<li>產(chǎn)品分類2</li>
</ul>
</li>
<li>聯(lián)系我們</li>
</ul>
</div>

上面的代碼是一個基本的導航菜單，我們可以通過以下代碼來遍歷生成菜單：

$(document).ready(function(){
$("#menu ul").each(function(){
var submenu = $(this).find("ul");
if(submenu.length){
var parent_li = $(this).parent("li");
parent_li.append("<a href='#'><img src='arrow.png' alt='Dropdown' /></a>");
var dropdown = parent_li.find("a:first");
dropdown.on("click", function(){
submenu.slideToggle();
return false;
});
}
});
});

上面的代碼遍歷了菜單的ul元素，并查找是否有二級菜單（即是否有包含ul的li元素），如果有則給該li元素添加一個下拉箭頭圖標，并且綁定點擊事件展開或收起二級菜單。

通過遍歷可以輕松地生成導航菜單，而且代碼量也比手寫少很多，這在實際開發(fā)中非常實用。