jquery各版本下载地址
<!DOCTYPE html><html lang="zh-CN"><head> ???<meta charset="UTF-8"> ???<meta name="keywords" content=""> ???<meta name="description" content=""> ???<meta name="viewport" ?????????content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> ???<title>Title</title> ???<link rel="icon" href=""> ???<style> ???????*{margin: 0; ???????padding: 0; ???????list-style: none; ???????} ???????span{ ???????????display: block; ???????????width: 100px; ???????????height: 50px; ???????????line-height: 50px; ???????????text-align: center; ???????????background-color: orchid; ???????????border: 1px solid #cccccc; ???????} ???????.menu{ ???????????display: none; ???????} ???</style></head><body><ul> ???<li class="lists"> ???????<span>人族</span> ???????<ul class="menu"> ???????????<li>剑侠客</li> ???????????<li>逍遥客</li> ???????????<li>巫蛮儿</li> ???????????<li>偃无师</li> ???????</ul> ???</li> ???<li class="lists"> ???????<span>魔族</span> ???????<ul class="menu"> ???????????<li>骨精灵</li> ???????????<li>狐美人</li> ???????????<li>杀破狼</li> ???????????<li>鬼潇潇</li> ???????</ul> ???</li> ???<li class="lists"> ???????<span>仙族</span> ???????<ul class="menu"> ???????????<li>玄彩娥</li> ???????????<li>神天兵</li> ???????????<li>舞天姬</li> ???????????<li>羽灵神</li> ???????</ul> ???</li></ul><script src="jquery.js"></script>//一定要先引入JQuery文件<script> ???$(".lists").on("click",function () { ???????$(this).children("ul").slideToggle(); ???????$(this).siblings().children("ul").slideUp(); ???})</script></body></html>jquery之手风琴效果
原文地址：https://www.cnblogs.com/wangxingren/p/10265881.html