JQuery購物商城導航欄是一個非常常見的網站導航組件，它能夠有效地幫助用戶在網站上快速找到自己需要的商品分類和頁面功能。

＜div class="nav"＞
＜ul＞
＜li＞＜a href="#"＞首頁＜/a＞＜/li＞
＜li＞＜a href="#"＞女裝＜/a＞
＜div class="sub-nav"＞
＜ul＞
＜li＞＜a href="#"＞連衣裙＜/a＞＜/li＞
＜li＞＜a href="#"＞半身裙＜/a＞＜/li＞
＜li＞＜a href="#"＞襯衫＜/a＞＜/li＞
＜li＞＜a href="#"＞上衣＜/a＞＜/li＞
＜li＞＜a href="#"＞褲子＜/a＞＜/li＞
＜/ul＞
＜/div＞
＜/li＞
＜li＞＜a href="#"＞男裝＜/a＞
＜div class="sub-nav"＞
＜ul＞
＜li＞＜a href="#"＞襯衫＜/a＞＜/li＞
＜li＞＜a href="#"＞T恤＜/a＞＜/li＞
＜li＞＜a href="#"＞褲子＜/a＞＜/li＞
＜/ul＞
＜/div＞
＜/li＞
＜li＞＜a href="#"＞配飾＜/a＞＜/li＞
＜li＞＜a href="#"＞家居＜/a＞＜/li＞
＜li＞＜a href="#"＞美妝＜/a＞＜/li＞
＜li＞＜a href="#"＞食品＜/a＞＜/li＞
＜/ul＞
＜/div＞

上面的代碼是一段最基本的JQuery購物商城導航欄的HTML結構，它包含了一個