Question

我的主要问题。您使用这种方法吗？

下面的代码是我考虑并实现该模式的代码。

我的搜索能力没有看到这种模式。

所以我问。

<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <title>JQuery</title>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
    <script>
        $(document).ready(function() {
            // loding
            var section = localStorage.getItem("menu");
            var last_section;

            if(section === 0) {
                last_section = 0;
            }
            else {
                last_section = section;
            }

            $("div").eq(last_section).toggleClass("dn");

            // section jquery
            var div_count = document.getElementsByTagName("div").length;

            $("button").click(function() {
                var index = $(this).index();

                if(last_section === index) {
                    return;
                }

                $("div").eq(last_section).toggleClass("dn");
                $("div").eq(index).toggleClass("dn");
                last_section = index;
                localStorage.setItem("menu", last_section);
            });
        });
    </script>

    <style>
        div {
            width: 100%;
            height: 500px;
        }

        .dn {
            display: none;
        }
    </style>
</head>

<body>
    <nav>
        <button>section1</button>
        <button>section2</button>
        <button>section3</button>
    </nav>
    <div class="dn" style="background-color: red;"></div>
    <div class="dn" style="background-color: blue;"></div>
    <div class="dn" style="background-color: yellow;"></div>
</body></html>

我用这段代码来思考问题

如果div太多，则加载时间会更长。如果是这样，当您使用切换到更少元素的功能时，它将显示出良好的效率。
刷新时我必须使用localstorage，因为没有物理地址uri

我问。使用时还有其他问题吗？

水疗模式？是否使用此方法？

0 个答案: