如何在同一个div中显示多个链接

<div>
  <a href="https://www.example1.com">Link 1</a>
  <a href="https://www.example2.com">Link 2</a>
  <a href="https://www.example3.com">Link 3</a>
</div>

<div id="links"></div>

<script>
  var linksDiv = document.getElementById("links");

  var link1 = document.createElement("a");
  link1.href = "https://www.example1.com";
  link1.textContent = "Link 1";
  linksDiv.appendChild(link1);

  var link2 = document.createElement("a");
  link2.href = "https://www.example2.com";
  link2.textContent = "Link 2";
  linksDiv.appendChild(link2);

  var link3 = document.createElement("a");
  link3.href = "https://www.example3.com";
  link3.textContent = "Link 3";
  linksDiv.appendChild(link3);
</script>

<style>
  .link {
    display: inline-block;
    margin-right: 10px;
    color: blue;
    text-decoration: underline;
    cursor: pointer;
  }
</style>

<div>
  <span class="link" onclick="window.location.href='https://www.example1.com'">Link 1</span>
  <span class="link" onclick="window.location.href='https://www.example2.com'">Link 2</span>
  <span class="link" onclick="window.location.href='https://www.example3.com'">Link 3</span>
</div>