多个li显示一个div页面

如果多个`li`元素需要显示同一个`div`页面，可以使用JavaScript来实现。具体步骤如下：

1. 为每个`li`元素添加一个点击事件，当点击时调用一个函数；
2. 在函数中获取要显示的`div`元素，然后设置它的`display`属性为`block`；
3. 同时，隐藏其他所有的`div`元素，将它们的`display`属性设置为`none`。

以下是示例代码：

HTML代码：

<ul>
  <li onclick="showDiv(1)">选项1</li>
  <li onclick="showDiv(2)">选项2</li>
  <li onclick="showDiv(3)">选项3</li>
</ul>

<div id="content">
  <div id="div1" class="hidden">选项1的内容</div>
  <div id="div2" class="hidden">选项2的内容</div>
  <div id="div3" class="hidden">选项3的内容</div>
</div>

CSS代码：

.hidden {
  display: none;
}

JavaScript代码：

function showDiv(index) {
  var divs = document.querySelectorAll('#content > div');
  for (var i = 0; i < divs.length; i++) {
    if (i === index - 1) {
      divs[i].style.display = 'block';
    } else {
      divs[i].style.display = 'none';
    }
  }
}

在上述代码中，`showDiv()`函数接收一个参数`index`，用于指定要显示的`div`的索引，然后通过`querySelectorAll()`方法获取所有的`div`元素，遍历它们并根据索引显示或隐藏它们。

需要注意的是，为了让每个`div`元素默认隐藏，需要在CSS中设置它们的`display`属性为`none`，并为它们添加一个`.hidden`类。