2

このマークアップでは、ラベル テキスト "E-mail" を "User Name" に置き換える必要があります。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

両方のラベルが選択され、両方のスパンに「ユーザー名」と表示されます。どうすれば最初のものだけを入手できますか?

これがフィドルです。

4

4 に答える 4

4

ラベルは同じ親要素を持たず、:nth-of-type兄弟 (同じ親を持つ要素) に基づいています。

注::nth-of-typeネイティブでサポートされていないブラウザーでは、jQuery によって実装されていません。つまり、IE6 7 または 8 では機能しません。

于 2012-08-17T17:38:05.430 に答える
3

:containsセレクターを試すことができます：

$('.foo label span:contains("Email")').text('user name');
于 2012-08-17T17:35:25.277 に答える
3

より具体的な属性によって、正しい要素をより確実に選択できます。

$("[for=pseudonym_session_unique_id] > span").text("user name");
于 2012-08-17T17:35:34.720 に答える
2

を使用し:eqます。

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

フィドル。

于 2012-08-17T17:36:04.330 に答える