下面有一个详细的小例子
<!DOCTYPE html>
<html>
<head>
<title>Accordion Menus</title>
<style type="text/css">
body{font-size:12px;text-align:center}
.clsFrame{width:300px;height:100px}
.clsFrame div,span{display:none;float:left;
width:65px;height:65px;border:solid 1px #ccc;margin:8px}
.clsOne{background-color:#eee}
</style>
<script language="javascript" src="jquery-2.1.1.js"> </script>
<script language="javascript" type="text/javascript" >
$(function(){
//ID匹配元素
$("#divOne").css("dispaly","block");
});
$(function(){//元素名匹配元素
$("div span").css("dispaly","block");});
$(function(){//类匹配元素
$(".clsFrame").css("dispaly","block");});
$(function(){//匹配所有元素
$("*").css("dispaly","block");});
$(function(){//合并配合元素
$("#divOne,span").css("dispaly","block");});
</script>
</head>
<body>
<div class="clsFrame">
<div id="divOne">id</div>
<div class="clsOne">class</div>
<span>span</span>
</div>
</body>
</html>
一个综合案例：