为了账号安全,请及时绑定邮箱和手机立即绑定

正在回答

2 回答

再好好看下视频,对照下js源码

0 回复 有任何疑惑可以回复我~

给你看下我写的html结构

<!DOCTYPE html>

<html lang="en">


<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <link rel="stylesheet" href="./index.css">

    <script src="./index.js"></script>

</head>


<body>

    <div class="wrapper">

        <ul>

            <li data-id="a">

                <span>家用电器</span>

            </li>

            <li data-id="b">

                <span>手机 / 运营商 / 数码</span>

            </li>

            <li data-id="c">

                <span>电脑 / 办公</span>

            </li>

            <li data-id="d">

                <span>家居 / 家具 / 家装 / 厨具</span>

            </li>

            <li data-id="e">

                <span>男装 / 女装 / 童装 / 内衣</span>

            </li>

            <li data-id="f">

                <span>美妆 / 个人护洁 / 宠物</span>

            </li>

            <li data-id="g">

                <span>女鞋 / 箱包 / 钟表 / 珠宝</span>

            </li>

            <li data-id="h">

                <span>男鞋 / 运动 / 户外</span>

            </li>

            <li data-id="i">

                <span>房产 / 汽车 / 汽车用品</span>

            </li>

            <li data-id="j">

                <span>母婴 / 玩具乐器</span>

            </li>

            <li data-id="k">

                <span>食品 / 酒类 / 生鲜 / 特产</span>

            </li>

            <li data-id="l">

                <span>艺术 / 礼品鲜花 / 农资绿植</span>

            </li>

        </ul>

        <div id="sub" class="none">

            <div id="a" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="b" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="c" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="d" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="e" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="f" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="g" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="h" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="i" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="j" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="k" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

            <div id="l" class="sub_content none">

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

                <dl>

                    <dt><a href="javascript:;">电视<i>&gt;</i></a></dt>

                    <dd><a href="javascript:;">超薄电视</a></dd>

                    <dd><a href="javascript:;">全屏电视</a></dd>

                    <dd><a href="javascript:;">智能电视</a></dd>

                </dl>

            </div>

        </div>

    </div>

</body>


</html>


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

二级菜单存在空白容器,怎么回事呢

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信