基础JQuery：数据属性+ children（）的区别

Question

我有一个基本的JQuery问题...我试图从列表元素中的2个子嵌套img标签中获取数据标题。

HTML看起来像这样

<li>
    <a href="/pages/...">
        <img  src="..." data-title="Norio Matsumoto" /> 
    </a>
    <h4>
        <a href="/pages/..."></a>
        <a href="/pages/..."></a>
    </h4>
</li>

img标签是<li>

内的两个孩子

这就是有趣的事情。

我有两种JQuery变体，对我而言，看起来是相同的：

第一个无效：

$(this).children('a img').data('title')

第二正在运作

$(this).children('a').children('img').data('title')

写children('firstChild nestedChild')和撰写children('firstChild').children('nestedChild')是不是一样？

此致 混淆

注意

请仔细阅读问题，我不是在寻找代码编辑或代码修复，我只是在问一个jquery问题。

Answer 1

.children()功能仅查看立即后代。由于没有<img>标记是<li>的直接后代，因此永远不会有任何匹配。

这样可行：

$(this).find('a > img').data('title')

如果有更深层嵌套的<a> + <img>组，事情可能会变得奇怪。