javascript - 如何使整个 div 可点击(变成链接)？

Question

我对此代码进行了许多更改，但它不起作用，我应该遵循什么步骤？我想让包括图标和按钮文本的整个部分可单击。我已经尝试过这种方法，但不确定是否正确:onclick="location.href='http://www.example.com';"

您可以根据需要进行更正，我愿意接受任何帮助，谢谢。

#ana_div {
  height: 400px;
  width: 960px;
  margin-right: auto;
  margin-left: auto;
  background-color: #f7f7f7;
}

.ikon {
  margin-left: 30px;
  margin-top: 15px;
  position: absolute;
}

.div {
  display: inline-block;
  float: left;
  height: 80px;
  width: 300px;
  margin: 10px;
}

.btn {
  border: none;
  color: black;
  height: 80px;
  width: 300px;
  font-size: 19px;
  cursor: pointer;
  background-color: #fff;
}

.btn:hover {
  background-color: #4d4d4d;
}

<div id="ana_div">

  <div class="div" id="div">
    <div class="ikon">
      <img src="icon.png">
    </div>
    <button class="btn"> button1
            </button>
  </div>

  <div class="div" id="div">
    <div class="ikon">
      <img src="icon.png">
    </div>
    <button class="btn"> button2
            </button>
  </div>

</div>

Answer 1

这很简单，一个由 anchor 标记包围的 div 标记。

a {
  text-decoration: none;
}

.big-div {
  height: 100px;
  width: 200px;
  background-color: red;
}

<a href="https://www.facebook.com/">
  <div class="big-div">
    <p>Click anywhere</p>
  </div>
</a>