js 实现导航层的显隐

<div class="navigation">
                            <ul id="nav">
                                <li><span>
                                    <img id="img_0" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>信息管理
                                    <ul id="u_0">
                                        <li>本站新闻</li>
                                        <li>行业新闻</li>
                                        <li>求购信息</li>
                                        <li>发布信息</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_1" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_1">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_2" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_2">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_3" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_3">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_4" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_4">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_5" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_5">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li><span>
                                    <img id="img_6" οnclick="nav_expand(this.id)" src="images/dian2.jpg" /></span>公司新闻
                                    <ul id="u_6">
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                        <li>公司新闻</li>
                                    </ul>
                                </li>
                                <li id="bottom_li"></li>
                            </ul>
                        </div>

var nav_li_ul_items = $get("nav").getElementsByTagName("ul");
function nav_expand(id) {

    var ul_id = "u" + id.substring(id.indexOf("_"));

    for (var i = 0; i < nav_li_ul_items.length; i++) {
        if (nav_li_ul_items[i].id == ul_id) {
            nav_li_ul_items[i].style.display = "block";
            $get("img_" + i).src = "images/dian1.jpg";
        } else {
            nav_li_ul_items[i].style.display = "none";
            $get("img_" + i).src = "images/dian2.jpg";
        }

    }
}

转载于:https://www.cnblogs.com/solomon_Blog/archive/2011/06/09/2076374.html