Question

在此标记中，我需要用“用户名”替换标签文本“E-mail”。我只能通过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

您可以尝试:contains选择器：

$('.foo label span:contains("Email")').text('user name');

Answer 2

您可以通过更具体的属性更可靠地选择正确的元素：

$("[for=pseudonym_session_unique_id] > span").text("user name");

Answer 3

标签没有相同的父元素，:nth-of-type基于兄弟元素（具有相同父元素的元素）。

注意：jQuery在本身不支持它的浏览器中没有实现:nth-of-type，这意味着它在IE6 7或8中不起作用。

Answer 4

使用:eq。

$('label:eq(0) span').text('user name');

Fiddle

按类型编号选择标签

4 个答案: