html - 如何设置2个div重叠并在点击时相互隐藏

Question

我想在另一个 div 上设置 1 个 div，点击时我想显示 1 个 div 并隐藏另一个，

我怎么能这样做？

<div id="div1">
            <ul>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
            </ul>
        </div>
        <div id="div2">
            <ul>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
                <li>Item</li>
            </ul>
        </div>

Answer 1

您可以使用它的 style.display 属性隐藏 DIV：

div1.style.display='none';  //will hide the div
div1.style.display='';      //will show the div