获取包含链接标签的href属性

Question

这个有点困难。我需要使用Jquery/JS找到包含链接标签的HREF属性的方法：

<a href="something.html"><img src="img1.jpg" class="active"></a>

我想通过类名定位图片，并查找第一个前置 href 属性的值。

$("img.active").somethingAwesome().attr("href");

请展示给我 somethingAwesome() ...有帮助吗？

- 3Dom

Answer 1

$("img.active").parent("a").attr("href")会获取直接父元素的href属性，假设它是一个锚点。如果图片和锚点之间有任何包含块的深度，请改用$("img.active").closest("a").attr("href")。

- lsuarez

---

使用closest而不是parent，这样重构更安全，并且性能没有区别。 - Daniel Dyson

太棒了！谢谢。这是一个新手问题。我想应该很容易。好老的Jquery。 - 3Dom

作为一个附带问题，最接近的搜索是向上还是向下文档。如果最接近的搜索同时检查向上和向下，则最接近的搜索太不可预测了。 - 3Dom

@3Dom .closest 向上搜索祖先。如果您想查找后代，您需要使用 .find()。 - lsuarez

感谢bodeaux，这对像我这样的新手真的很有帮助。请随意享受成为我班上最聪明的人的荣耀。我今天的理论是：一个好问题就是问题的一半答案。 - 3Dom

如果 ($(img.active").parent("a")){ var $parent="母亲"; var $found = (this).attr("href"); } else { var $parent="拖车垃圾"; var $found = $(this).closest("a").attr("href");}; - 3Dom

Answer 2

.parent()是你所需的全部内容！

$("img.active").parent().attr("href");

这里是文档 :)

根据Kyle的评论，并为了尽可能地使内容强大，你可以尝试：

$("img.active").closest('a[href]').attr("href");

那么，即使您的HTML看起来像这样：

<a href="something.html">
    <a name="anchor">
        <img src="img1.jpg" class="active">
    </a>
</a>

你仍然会得到你所需的 :)

- simon

---

如果锚点和图像之间有另一个元素，则此方法将无法正常工作。应该使用closest()方法。 - Kyle

他想要“第一个前面的href属性”。 - Kyle

是的，好的，公平地说，这是一个完全有效的解释。这个例子并不完全清楚是否代表性。但是如果我们假设它不是，那么还有各种其他可能的问题。例如，如果中间有一个<a name=""></a>元素会怎样呢？.closest('a')也会失败，需要使用.closest('a[href]')！ - simon

感谢你们所有人为付出如此英勇的努力。这个论坛是多么令人惊叹啊！以一种逻辑方式在文档中进行上下搜索是我的主要疑问。我会说，JS样式优于CSS样式的最重要的好处是能够通过一个不相关的元素更改样式。这绝对是JS最强大的资产。 - 3Dom

@3Dom：别担心，我没有任何问题可以接受@lthibodeaux的答案——它是正确的，简洁的，并且他关于嵌套锚点严格无效的说法是正确的（尽管在实际中看到过...）。无论如何，很高兴你得到了你需要的 :) - simon

Answer 3

$("img.active").closest('a').attr("href");

- xkeshav

---

如果我的示例代码有多个实例，其中只有两个有锚点，我想找出该标签是否被包含在HREF标签中。 - 3Dom

parent() 是我为此目的发现的最好的东西，但是你所有的评论都极大地帮助了我。 - 3Dom

Answer 4

$("img.active").closest("a").attr("href");

- Kyle