Question

我有一个旋转木马幻灯片，我想用链接选择所有图像。问题在于链接图像和没有链接的普通图像。

HTML：

 <ul class="slides">
        <li><a href="example.com">
            <img src="exampleimg1.jpg" /></a></li>
        <li>
            <img src="exampleimg2.jpg" /></li>
        <li><a href="example3.com">
            <img src="exampleimg3.jpg" /></a></li>
    </ul>

如果我尝试$('.slides li a')我只能获得带链接的那些，但我需要两者。如果我尝试$('.slides li a, .slides li img')我得到所有带链接但没有链接的图像，但带链接的图像出现两次（在这种情况下为5，我需要3）。我只想要每一张图片。

EDIT1：好的。我忘了提一点细节。

＆lt;“li”＆gt;元素有时包含div或h1（内容来自CMS）。因此，上述解决方案不起作用。我不希望幻灯片中包含div和h1等，只有图像，如果存在：带链接的图像。

很抱歉第一次不清楚。

更新示例：

<ul class="slides">
<li>
  <div class="abc">
    <h1>some heading</h1>
      <a href="example.com">
        <img src="exampleimg1.jpg" />
      </a>
  </div>
</li>
<li>
  <div class="abcwrap">
    <img src="exampleimg2.jpg" />
  </div>
</li>
<li>
  <a href="example3.com">
     <img src="exampleimg3.jpg" />
  </a>
</li>
</ul>

Edit2：解决了它！

如果有人好奇的话：选择： $（'。slides li img'）。parent（）

Answer 1

如果您想要外部img。

，请使用Child Selector (“parent > child”)代替Descendant Selector (“ancestor descendant”)

$('.slides li a, .slides li > img')

Answer 2

使用“＆gt;”选择直接的孩子。

$('.slides > li > a, .slides > li > img')

请参阅http://jsfiddle.net/a7XAw/1/

jQuery选择器img和a

2 个答案: