Select元素有两个使用jQuery的特定子元素
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Select元素有两个使用jQuery的特定子元素相关的知识，希望对你有一定的参考价值。
我想通过匹配两个孩子来选择父母。我的代码：
$('span:contains("11:00am"), span.name:contains("Tom")').parents("a").css("background-color","rgb(255, 255, 255)");<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a style="background-color: rgb(0, 0, 0);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Tom</span>
</a>
<a style="background-color: rgb(0, 0, 0);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Jack</span>
</a>然而，这将选择汤姆和杰克的时间。
答案
你需要选择a标签，然后使用:has()选择器过滤元素有特定的孩子。
$('a:has(span:contains("11:00am")):has(span.name:contains("Tom"))')
$('a:has(span:contains("11:00am")):has(span.name:contains("Tom"))').css("background-color","rgb(255, 255, 255)");<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a style="background-color: rgb(0, 0, 0);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Tom</span>
</a>
<a style="background-color: rgb(0, 0, 0);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Jack</span>
</a>另一答案
$('span:contains("11:00am"),span:contains("Jack")').parent("a").css("background-color", "Grey");
$('span:contains("11:00am"),span:contains("Tom")').parent("a").css("background-color", "Green");<a style="background-color: rgb(255, 255, 255);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Tom</span>
</a>
<a style="background-color: rgb(255, 255, 255);">
<div class="time">
<span>11:00am</span>
</div>
<span class="name">Jack</span>
</a>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>以上是关于Select元素有两个使用jQuery的特定子元素的主要内容，如果未能解决你的问题，请参考以下文章