jquery - 按第 n 个类型选择标签

Question

在此标记中，我需要将标签文本“电子邮件”替换为“用户名”。我只能通过 jQuery 访问。

    <div class="foo" style="border:1px solid #444">
          <span class="field-with-fancyplaceholder">
          <label class="placeholder" for="pseudonym_session_unique_id" style="font-size: 13px;">
          <span>Email</span>
          </label>
          <input id="pseudonym_session_unique_id" class="text" type="text" size="30" name="pseudonym_session[unique_id]">
</span>
          <span class="field-with-fancyplaceholder">
          <label class="placeholder" for="pseudonym_session_password" style="font-size: 13px;">
          <span>Password</span>
          </label>
          <input id="pseudonym_session_password" class="text" type="password" size="30" name="pseudonym_session[password]">
          </span>
        </div>

当我尝试这个时

$('label:nth-of-type(1)').addClass('bar');  
$('.bar span').text('user name'); 
// because $('label:nth-of-type(1) span') doesn't work 

两个标签都被选中，并且两个跨度都显示“用户名”。我怎样才能得到第一个？

Here's the fiddle .

Answer 1

标签没有相同的父元素，并且 :nth-of-type 基于兄弟元素(具有相同父元素的元素)。

注意::nth-of-type 未在本身不支持它的浏览器中由 jQuery 实现，这意味着它无法在 IE6 7 或 8 中工作。