jQuery 点击 & 获取 a href 属性的值

在本文中，我们将介绍如何使用jQuery来实现点击a标签并获取其href属性的值。

阅读更多：jQuery 教程

一、点击事件

在jQuery中，可以使用click()方法来绑定点击事件。我们可以选择目标元素，并为其绑定click事件，当用户点击该元素时，该事件将被触发。

以下是一个简单的示例，点击按钮时会在控制台输出一条消息：

<button id="myBtn">点击我</button>

<script>
$("#myBtn").click(function() {
  console.log("按钮被点击了！");
});
</script>

在上面的示例中，我们使用了$("#myBtn")来选择id为myBtn的元素，并为其绑定了一个click事件。当用户点击按钮时，控制台将会输出一条消息。

二、获取属性值

在jQuery中，可以使用attr()方法来获取或设置元素的属性值。为了获取a标签的href属性的值，我们可以使用attr(“href”)方法。

以下是一个示例，点击a标签时会在控制台输出其href属性的值：

<a href="https://www.example.com" id="myLink">点击我</a>

<script>
("#myLink").click(function() {
  var href =(this).attr("href");
  console.log("点击的链接是：" + href);
});
</script>

在上面的示例中，我们使用了$("#myLink")来选择id为myLink的a标签，并为其绑定了一个click事件。当用户点击该链接时，控制台将会输出链接的href属性的值。

三、实际应用

现在，我们来看一个更实际的应用场景。假设我们有一个列表，其中包含多个标签，我们希望能够点击每个链接并获取其href属性的值。

<ul id="myList">
  <li><a href="https://www.example.com">链接1</a></li>
  <li><a href="https://www.example.com">链接2</a></li>
  <li><a href="https://www.example.com">链接3</a></li>
</ul>

<script>
("#myList a").click(function() {
  var href =(this).attr("href");
  console.log("点击的链接是：" + href);
});
</script>