jquery选择器查找子元素
Posted
技术标签:
【中文标题】jquery选择器查找子元素【英文标题】:jquery selector to find a child element with 【发布时间】:2011-10-26 23:39:06 【问题描述】:已经用谷歌搜索和试错了一个小时,试图提出一个 jquery 选择器来访问可扩展树中的几个标签元素之一。 html是这样的:
<span id="ppown" class="treeTitleSpan" role="leaf">PPO</span>
<span class="treeCheckBoxLabel">
<label class='nodeCheckIcon' />
或者像这样:
<span id="ppw" class="treeTitleSpan" role="leaf">Other</span>
<span class="handle closed"></span>
<span class="treeCheckBoxLabel">
<label class='nodeCheckIcon' />
在每种情况下,我都是从 .treeTitleSpan 跨度开始的(在点击处理程序中)。我知道我可以通过以下方式访问:
$(this).next().next().children('.nodeCheckIcon');
另一个是:
$(this).next().children('.nodeCheckIcon');
但我想要一个适用于两种情况的选择器,“查找”似乎不起作用:
$(this).find('.nodeCheckIcon:first')
任何帮助将不胜感激。
瑞克
【问题讨论】:
【参考方案1】:$(this).nextAll('.treeCheckBoxLabel').children('.nodeCheckIcon');
或者,如果您可能有多个标签,例如:
<span id="ppw" class="treeTitleSpan" role="leaf">Other</span>
<span class="handle closed"></span>
<span class="treeCheckBoxLabel">
<label class='nodeCheckIcon' />
</span>
<span class="treeCheckBoxLabel">
<label class='nodeCheckIcon' />
</span>
而你只想要第一个:
$(this).nextAll('.treeCheckBoxLabel').first().children('.nodeCheckIcon');
【讨论】:
【参考方案2】:这样的事情怎么样:
$(this).nextAll('.treeCheckBoxLabel:first').children('.nodeCheckIcon');
使用:first
可确保您最多只能选择一个.treeCheckBoxLabel
,这可能是也可能不是问题,具体取决于HTML 的其余部分。
【讨论】:
【参考方案3】:其他帖子的替代品(给猫剥皮的多种方法:))
$(this).siblings(".treeCheckBoxLabel:has(label.nodeCheckIcon):first")
【讨论】:
【参考方案4】:由于this
指向span
元素,它是label
的父元素的兄弟,$(this).find('.nodeCheckIcon:first')
将不起作用。我不知道你的完整标记结构,但如果你有这个 span 元素的包装容器,那么你可以试试这个
$(this).parent().find('.nodeCheckIcon:first');
【讨论】:
以上是关于jquery选择器查找子元素的主要内容,如果未能解决你的问题,请参考以下文章
JQuery中查找父元素,子元素,追加元素,插入元素和删除元素