Javascript jQuery/js-如何从基于href的类中获取菜单名

我想在用户单击时获取菜单名

<a class="menu" onclick="getMenu()" href="#"> Home </a>
<a class="menu" onclick="getMenu()" href="#"> About</a>
<a class="menu" onclick="getMenu()" href="#"> Contact</a>

预期结果

---

主页是单击/联系人是单击

将单击的元素对象传递给函数：

<a class="menu" onclick="getMenu(this)" href="#"> Home </a>

此外，您可能还希望删除文本周围的空白：

obj.textContent.trim();

查看下面的演示

功能获取菜单（obj）{
警报（obj.textContent.trim（））；
}

像这样，将
此
（指当前元素）传递到函数
getMenu
，并从您可以使用的链接中获取内容


功能获取菜单（el）{
警报（el.innerHTML+'is click'）；
}
在使用jQuery时使用更干净的方式：

<a class="menu" id="1"  href="#"> Home </a>
<a class="menu" id="2"  href="#"> About</a>
<a class="menu" id="3"  href="#"> Contact</a>

<script>
$(".menu").click(function(){
    var currentId = $(this).attr("id");
    alert($.trim($("#"+currentId).text()));
});
</script>

如果您想要jQuery方法

您不需要单击
onclick
属性

此
-用于触发功能的元素

.textContent
-元素的文本内容

.trim（）
-删除空白

this.textContent.trim()

元素文本内容修剪


$（'.menu'）。单击（函数（）{
警报（this.textContent.trim（））；
});
下面有一些很棒的答案！共享了一些不同的方法。
<a class="menu" id="1"  href="#"> Home </a>
<a class="menu" id="2"  href="#"> About</a>
<a class="menu" id="3"  href="#"> Contact</a>

<script>
$(".menu").click(function(){
    var currentId = $(this).attr("id");
    alert($.trim($("#"+currentId).text()));
});
</script>

this.textContent.trim()