用JQuery+CSS来实现树形菜单

一、实现功能
想要做成树形菜单，无非就是点击父菜单，则把它的子菜单显示出来。
二、设计思路
要想实现此效果，则当点击父菜单时，给父菜单添加事件，调用toggle()函数来把它的子菜单显示出来。
并把子菜单的“+”号改为“-”号。
三、完成以上两步后，则开始用代码实现了
1.在你的html里面设计几个

来

+体育新闻

    篮球新闻

    足球新闻

+娱乐新闻

    港台新闻

    大陆新闻

 设计的父菜单和子菜单虽然在同一级别上，但可以用 来将它们区分开来。
 
2.然后在你的css里面设置div的样式：
.p{
cursor:hand;
}


.news{
width: 100px;
}


.c{
display:none;
}

3.在你的js里实现功能：
$(document).ready(function(){
$(".p").click(function(){
$(this).nextAll().toggle();
var objOperator = $(this).children("span");
if(objOperator.html()=="+"){
objOperator.html("-");
}else{
objOperator.html("+");
}
});
});

四、 用浏览器进行测试并显示结果如下：

刚进入页面时：点击父菜单时：