如何解决仅获取 javascript 或 jquery 中类型的第一级子级
我有以下 html 结构:
<div class="tab-content">
<div><p>First tab content</p></div>
<div><p>Second tab content</p></div>
<div><p>Third tab content</p><br />
<div class="myvideos">
<iframe src="http://www.youtube.com/embed/YWD2Z14w99Y"></iframe>
</div>
</div>
</div>
并且我正在使用以下内容来获取所有选项卡内容 div:
$('.tab-content div').hide();
我希望 jQuery 函数只获取 "tab-content" 中的第一个子元素。 澄清 - 我只想要第一个 Child divs 一代,而不是他们的孩子
即。请注意,第三个选项卡内容有第二个子 div,我想忽略它。我也尝试了以下方法,但它们似乎不起作用:
$('.tab-content > div').hide();
$('.tab-content div:first-of-type').hide();
有没有办法只获得第一个孩子的div?这可以使用 jQuery 或 Vanilla JS。
解决方法
试试这个
jQuery(".tab-content > div").first().hide();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="tab-content">
<div><p>First tab content</p></div>
<div><p>Second tab content</p></div>
<div><p>Third tab content</p><br />
<div class="myvideos">
<iframe src="http://www.youtube.com/embed/YWD2Z14w99Y"></iframe>
</div>
</div>
</div>
Vanilla JS 解决方案可能如下所示:
document.querySelector(".tab-content").children[0].style.visibility = "hidden"
,
$('.tab-content div:first-child').hide();
是解决方案
事实证明这最终解决了它:
$(".tab-content > div").hide();
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。