选择具有相同类的所有元素，其中一些具有两个类

Posted 2023-05-09

【中文标题】选择具有相同类的所有元素，其中一些具有两个类

【英文标题】：Select all the elements with the same class, with some having two classes

【发布时间】：2017-08-06 22:31:44

【问题描述】：

我尝试选择所有具有相同类的元素，并对它们执行 css()。

当元素有一个类时它可以工作，但是当它们有两个类时，这些类不会被选中。

我的元素：

var ville; 


$("#enigme1_answers td").hover(

	function() 
		
		ville = $(this).html().toLowerCase();		
		
		$( "[class=" + ville + "]" ).css("background-color", "red");
		
		
	, function() 
		
		$( "[class=" + ville + "]" ).css("background-color", "#2a3843");
	
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
	<td class="oslo"> O </td>
	<td class="oslo lecaire"> L </td>
	<td class="oslo viennes"> S </td>
	<td class="oslo gaborone"> O </td>
	<td class=erevan"> V </td>
	<td class="berlin"> N </td>
	<td class="rome"> E </td>
	<td class="athenes"> S </td>
	<td class="athenes"> E </td>
	<td class="athenes"> N </td>
	<td class="athenes"> E </td>
	<td class="athenes"> H </td>
	<td class="athenes"> T </td>
	<td class="athenes damas"> A </td>
</tr>

我使用 $("[class=myclass]") 方法。 像 Athenes 一类的元素（除了 A）被正确修改，但不是那些具有两个类的元素。我希望在选择其中一个类时修改元素。

谢谢，

【参考方案1】：

用途：

$(".classname")

代替：

$("[class=classname]")

为什么

[class=classname] 比较整个类属性，所以你得到了两个类，oslos 和 lecaire。而$(".classname") 将获取该类的所有 HTML 对象。

将其应用于您的代码

$("#enigme1_answers").hover(function() 	
  $(this).find("td.oslo").css("background-color", "red");
, function() 
  $(this).find("td.oslo").css("background-color", "#2a3843")
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
	<tr id="enigme1_answers">
		<td class="oslo"> O </td>
		<td class="oslo lecaire"> L </td>
		<td class="oslo viennes"> S </td>
		<td class="oslo gaborone"> O </td>
		<td class="erevan"> V </td>
		<td class="berlin"> N </td>
		<td class="rome"> E </td>
		<td class="athenes"> S </td>
		<td class="athenes"> E </td>
		<td class="athenes"> N </td>
		<td class="athenes"> E </td>
		<td class="athenes"> H </td>
		<td class="athenes"> T </td>
		<td class="athenes damas"> A </td>
	</tr>
</table>

【讨论】：

是的，我是先做的，但它只对具有类的第一个字母执行 css() 操作，而不是全部

查看适用于您的代码的部分，更新帖子。我注意到您的<tr> 周围没有table，这使得tr 无法检测到。

嘿，如果您可以将我的答案标记为解决方案/赞成票，那将很有帮助。如果您还有其他问题，请问我。我打算休息一晚，但我明天会回来。

并检查.find，如果它是正确的，你有正确的答案不要担心

是的，如果你好奇的话，看看 css 选择器。 jQuery 在查找元素时使用它们。