<分区>
<分区>
作为这个问题的序言，这不是像许多其他结构这样的场景:
<div>
<div class="ErrorMessage"></div>
<div class="ErrorMessage"></div>
<div class="ErrorMessage"></div>
<div class="ErrorMessage"></div>
</div>
我知道 :first-of-type 或 :first-child 对那些有用。
我的场景是当我在整个 DOM 的多个元素上调用同一个类，但它们并不都遵循相同的结构。例如，我可能在页面的某个位置有这种结构。
<div class="appArea">
<p class="ErrorMessage">
Some text to be changed
</p>
</div>
<div class="appArea">
<div class="something-for-space">
<p class="ErrorMessage">
Some text
</p>
</div>
</div>
<div class="appArea">
<table class="some-random-table">
<tr>
<td>
<p class="ErrorMessage">
Some text
</p>
</td>
</tr>
</table>
</div>
我的兴趣在于如何仅选择该类的第一次出现“ErrorMessage”。我需要更改它的默认文本，我有一个正在运行的 jQuery 脚本，但它会更改每个“ErrorMessage”的文本。我无法找到合适的选择器组合来确保只更改第一个。
fiddle 引用:https://jsfiddle.net/md6f0cb8/41/
即使我为类的所有实例更改它，也不是世界末日。我可以用 CSS 隐藏其他实例(其他都是多余的)。但同样，我没有合适的选择器来确保只显示第一个出现的地方，而其他的都被隐藏。
非常感谢任何帮助!
最佳答案
您需要的是 .eq() jQuery 方法:
$(document).ready(function() {
$(".ErrorMessage").eq(0).replaceWith("<span>Erreur : Veuillez vérifier les renseignements saisis ci-dessous. Certains champs sont obligatoires et d'autres présentent des contraintes de saisie particulières.</span>");
$(".appArea span:first-of-type").addClass('testing');
});.testing {
font-size: 24px;
color: red;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="appArea">
<p class="ErrorMessage">
Some text to be changed
</p><br/><br/>
</div>
<div class="appArea">
<div class="something-for-space">
<p class="ErrorMessage">
Some text to be changed
</p><br/><br/>
</div>
</div>
<div class="appArea">
<div class="someother-random-div">
<p class="ErrorMessage">
Some text to be changed
</p>
</div>
</div>关于jquery - 使用 CSS 选择器仅针对类的第一次出现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51558041/