替换多个项目的每个第一个孩子的文本

Question

两个相同的选择框

<select class="select">
  <option>- OPTION -</option>
  <option>1</option>
  <option>1</option>
</select>

<select class="select">
  <option>- OPTION -</option>
  <option>1</option>
  <option>1</option>
</select>

替换- OPTION -为- SELECT -

$(".select option:first").text("- SELECT -");

上面的代码只替换第一个选择框,忽略第二个.为什么？如何申请全部/任何？

https://jsfiddle.net/oLbfs901/2/

Answer 1

:first 将只选择组合在一起的所有选项的第一个元素.

:first-child 将选择所有父元素的第一个子元素.

$(".select option:first-child").text("- SELECT -");

关于速度的更新

下面,用户@kosmos建议使用.find().这种方法的性能远低于使用方法:first-child.一些开发人员通常不会对性能进行三思而后行,因为它仍然非常快,但这些可以加起来.现在你知道有更快的方法来实现相同的结果,所以我建议使用这些知识.

这是我设置确认的测试用例:http://jsperf.com/find-versus-first-child