Javascript 点击抓取href标签

我正试图抓取在“导航”div中单击的元素上的href标记 当前代码每次都返回“#BiblesandCommentaries”，无论我在导航div中单击哪个元素

html

像这样使用

.find（）.attr（）

总是会得到第一个，您需要更改

函数的选择器，单击
以指向
a
，如下所示：

$('.navigation a').click(function(e) {
    e.preventDefault(); //use this if you don't want to reload the page
    var test = $(this).attr('href');
    alert (test);
}); 

你也应该声明你的变量

编辑好的评论，我只是在修改他的代码，但你看：

$('.navigation a').on("click",function(){
       alert($(this).attr('href'));
});

编辑哈哈评论，让我们学究一点：

$("div.navigation").on("click", "a", function(e) {
    e.preventDefault();
    alert ($(this).attr('href'));
});​​​​

在不阻止标记的默认操作的情况下，您将重新加载页面

编辑：想更进一步吗？忘记jQuery吧。这里有一些

.navigation
只有一个（ul）。试试像这样的东西

$('.navigation a').click(function() {
    var test = $(this).attr('href');
    alert (test);
});

总的来说，您应该尝试以下最佳做法：

$('div.navigation').on("click", "a", function() {
    alert($(this).attr('href'));
});

请记住，除非必须对同一元素多次解析DOM，否则不要在内存中设置变量。此外，请始终尝试尽可能多地深入jQuery选择器，以减少需要解析的DOM。如果这不合理，就这样想吧。如果它必须只解析类“navigation”的div标记，那么它应该删除所有其他标记，并且比解析它的class属性的每个标记花费的时间要少得多

或者您可以关注事件：

$('div.navigation').on("click", function(event) {
    if(event.target.href){ alert(event.target.href); }
});

执行上述操作的原因也是出于内存目的。如果只查看包装器，则内存中只有一个事件侦听器。如果在“a”标记本身上有事件侦听器，则必须在内存中为包装器中的每个“a”标记都有一个事件侦听器。这可能会很重。。。想象一下，如果谷歌在图像页面中加载的每个图像上都有一个事件侦听器。。。您的内存不足。
您获得“第一个”的原因是因为您在“导航”中，并且.find（）在第一个匹配案例中停止，所以每次都是第一个。@Relic实际上
。find
将获得所有匹配；是
.attr
在第一次匹配时停止。@mblase75右侧，它将从返回的数组的第一个部分移出。我的错…你根本不应该在这里声明变量，你只在这里使用jQuery对象一次。。。此外，在可以避免使用“.click（）”的地方，您不应该再使用它，因为它不会监视DOM中的新元素。只有在执行此代码时才存在。这会将一个处理程序单独绑定到每个锚点，这是不必要的，而且速度较慢（尽管差异可能不明显）。@relic我认为
警报
只是为了测试。实际的目标是存储值，因为原始函数引用了一个全局
test
var.@并非不可察觉，请阅读我关于使用事件与添加处理程序的回答。@relic我只为您添加了一个示例，因为您非常特殊。@Mathletics在内存中设置位置的唯一原因是您以后需要它，对吗？如果已经设置了jQuery对象一次，为什么还要花时间呢？通过这种方式，只要你从选择器的值和它的属性中得到结果，它就会变成一个字符串，然后在这种情况下，在函数调用（警报）时间内设置为变量值是便宜的，不要认为它会对将事件附加到十几个链接或声明一个变量产生任何影响，如果他在10k链接上这样做的话，情况可能会不同+代码为1golf@relic我想他以后会需要的。为什么有人只想在点击时提醒一个href？显式不存储值听起来像是最糟糕的过早优化。我对提供的代码片段暗示了尽可能好的标准，如果您注意到我同意您的意见，当变量存在范围时，如果没有，请不要设置它。内存和CPU周期就是它们。如果你能始终保持最佳标准，那么你以后要做的重构就会更少。
event.target.href
对于散列锚，它将返回完整的URL字符串，domain+hash，我想他只是想要散列。（我只测试了chrome，所以这不是经典）
$('.navigation a').click(function() {
    var test = $(this).attr('href');
    alert (test);
});

$('div.navigation').on("click", "a", function() {
    alert($(this).attr('href'));
});

$('div.navigation').on("click", function(event) {
    if(event.target.href){ alert(event.target.href); }
});