排序列表只获取子项
排序列表只获取子项
提问于 2015-03-25 14:53:34
HTML
$(".something > ol li").each(function () {
alert($(this).text());
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="something">
<ol>
<li>Something</li>
<ol>
<li>Something 2</li>
</ol>
<li>Something 3</li>
</ol>
</div>
它会提醒一些东西，一些东西2和什么东西3。
我需要的是只通知直接子项目。所以我只需要提醒一些东西和3件事。
我该怎么做？
非常感谢!
回答 3
Stack Overflow用户
回答已采纳
发布于 2015-03-25 15:09:06
你原来的选择器已经接近了。选择器A > B匹配与B匹配的A的直接子级，而不是遍历所有后代。
因此，以下内容将适用于你：
$(".something > ol > li").each(function () {
alert($(this).text());
});Stack Overflow用户
发布于 2015-03-25 15:05:04
只从li 儿童从ol。这样，您将跳过列表中存在的其他标记。
$(".something > ol").children('li').each(function () {
alert($(this).text());
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="something">
<ol>
<li>Something</li>
<ol>
<li>Something 2</li>
</ol>
<li>Something 3</li>
</ol>
</div>
Stack Overflow用户
发布于 2015-03-25 15:44:17
您的HTML无效。<ol>不能直接包含另一个<ol>。资料来源：w3.org.您需要将其嵌套在<li>中。
<div class="something">
<ol>
<li>Something
<ol>
<li>Something 2</li>
</ol>
</li>
<li>Something 3</li>
</ol>
</div>接受的答案将不再起作用，因为所有子元素的文本将由text()返回。有一种肮脏的方法只能从直接的子李那里获得文本：
$(".something > ol > li").each(function () {
var text = $(this).clone()
.children()
.remove()
.end()
.text();
alert(text);
});但是，我推荐一种更干净的方式，用一个跨度包装文本：
<div class="something">
<ol>
<li><span>Something</span>
<ol>
<li>Something 2</li>
</ol>
</li>
<li>Something 3</li>
</ol>
</div>现在这个JS可以工作了：
$(".something > ol > li > span").each(function () {
alert($(this).text());
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/29259068
复制相关文章
相似问题
腾讯云开发者
