jQuery选择图像的父级a元素

Question

我正在尝试选择锚点标签并添加 target 属性。当它包裹在一个带有 class=size-thumbnail 的图像中时，为什么无法工作？

<a href="example"><img class="size-thumbnail" src="example"></a>

jquery

$('.size-thumbnail:parent').attr('target','_blank');

- ThomasReggi

---

我认为在这种情况下使用:parent选择器会给你每个具有子元素的.size-thumbnail。由于图像不能有子元素，因此这永远不会起作用。 - Bryan Downing

Answer 1

试试这个：

$('a').has('img.size-thumbnail').attr('target','_blank'); 

或者

$('a.has(img.size-thumbnail)').attr('target','_blank'); 

- Chandu

Answer 2

你对 :parent 的含义有些误解，它选择的是包含选定元素的父元素，而不是选定元素的父元素。请尝试使用以下代码：

$('.size-thumbnail').parent().attr('target','_blank');

- Ben Blank

Answer 3

使用.parent()来遍历DOM树向上移动。

例如：

var Link = $("img.size-thumbnail").parent();

然后，像这样在Link变量上应用attr等方法：

var Link = $("img.size-thumbnail").parent();
Link.attr("target","_blank");

- RobertPitt

Answer 4

所有的答案都看起来不错，但你也可以反过来做：

$('a:has(.size-thumbnail)').attr("target","_blank");

你不能这样做，因为嵌套的锚标签是无效的 ;) 所以图像始终是一个锚的子元素，而不是多个锚的子元素。

- Caspar Kleijne

---

性能应该只有在存在大量此类图像时才会受到影响，但是.parent()实际上比 :has 要快得多。jQuery使用DOM的.parentNode属性（静态查找）来优化.parent()，而:has则需要子查询。 - Ben Blank

Answer 5

那不是:parent的工作方式。

:parent表示选择其他元素的父元素。

你需要

$('.size-thumbnail').parent().attr('target','_blank');

- Gabriele Petrioli