jquery 实现 table 和 标题 的联动显示

html代码：
<li class="active">
<a href="#word" onclick="setdisplay('word')" data-toggle="tab">单字</a>
</li>
<li>
<a href="#vocabulary" onclick="setdisplay('vocabulary')" data-toggle="tab">词汇</a>
</li>
<table id="word" style="display: block">
    <thead>
        <th>编号</th>
        <th>字</th>
    </thead>
</table>
<table id="vocabulary" style="display: none">
    <thead>
        <th>编号</th>
        <th>词汇</th>
    </thead>
</table>
点击标题后调用的javascript函数是：
    function setdisplay(catalog) {
        var str = catalog.toString();
        $("#word").hide();//先把所有的隐藏，然后再显示你想显示的
        $("#vocabulary").hide();
        $("#"+str+"").show();
    }

$("#word").show();表示style="display: block", $("#word").hide()表示display:none; • 1

$("#word").toggle()切换元素的可见状态。如果元素是可见的，切换为隐藏的；如果元素是隐藏的，切换为可见的。• 1

("#id").css('display','none'); 
$("#id").css('display','block'); 

$("#id")[0].style.display = 'none';