jQuery是目前使用最广泛的JavaScript库之一，它简化了JavaScript的编写过程，提高了开发效率。其中，用于制作菜单栏的插件非常实用，可以让我们快速地创建出漂亮而且好用的菜单栏。

下面就让我们使用jQuery的一个菜单栏插件，来创建一个简单的菜单栏示例

// HTML代码

<div class=\"menu\">

<ul>

<li><a href=\"#\">菜单1</a></li>

<li><a href=\"#\">菜单2</a></li>

<li>

<a href=\"#\">菜单3</a>

<ul>

<li><a href=\"#\">子菜单1</a></li>

<li><a href=\"#\">子菜单2</a></li>

<li><a href=\"#\">子菜单3</a></li>

</ul>

</li>

<li><a href=\"#\">菜单4</a></li>

</ul>

</div>

// JS代码

$(function() {

$(\'.menu ul li:has(ul)\').addClass(\'has-sub\');

$(\'.menu ul li a\').click(function() {

var checkElement = $(this).next();

if((checkElement.is(\'ul\')) && (checkElement.is(\':visible\'))) {

return false;

}

if((checkElement.is(\'ul\')) && (!checkElement.is(\':visible\'))) {

$(\'.menu ul li ul:visible\').slideUp(\'normal\');

checkElement.slideDown(\'normal\');

return false;

}

});

其中，如果某一菜单项还有子菜单，我们会在其外部包裹一个`ul`元素，这样可以创建出下拉式的菜单栏。