0

OK、これが基本的なレイアウトです。

<div class="products">
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 1</div>
            <div class="item_price_box">
                <p class="item_price">
                    <span class="item_price_label">Price</div>
                    <span class="item_price_text">$265</div>
                </p>
            <div>
        </a>
    </div>
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 2</div>
            <div class="item_price_box">
                <p class="item_price">
                    <span class="item_price_label">Price</div>
                    <span class="item_price_text">$550</div>
                </p>
            <div>
        </a>
    </div>
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 3</div>
            <div class="item_price_box">
                <p class="item_price">
                    <span class="item_price_label">Price</div>
                    <span class="item_price_text">$995</div>
                </p>
            <div>
        </a>
    </div>
    ...
</div>

「UniqueTitle2」というテキストを含む「item_title」を含む「product_item」のみを選択する必要があります。

次に、その「product_item」にのみクラスを追加し、そのアイテムの「item_price_label」にHTMLを追加する必要があります。

ここに示されているものとは異なり、最大80個のアイテムがすべて一意の名前でリストされます。JavaScriptを介してのみHTMLを直接編集することはできません。

私はこれまでに持っていました：

 $('div:contains("Unique Title 2")').parent().parent().addClass('foo');

しかし、どういうわけかそれはすべてのアイテムにそれを追加し続けました、そして私がHTMLを注入しようとしたとき、それはページのすべてのコンテンツを置き換えました。

$('.foo').find('.item_price_label').html('<div class="new_stuff_here">Yay content here</div>');

何か案は？ありがとう ：）

4

3 に答える 3

1

filter次の方法を使用できます。

$('.item_title').filter(function() {
     var txt = this.textContent || this.innerText;
     return txt === "Unique Title 2";
}).closest('.product_item').addClass('foo').doOtherStuff();

マークアップが無効であることに注意してください。スパン要素を。で閉じています</div>。

于 2013-01-17T00:15:01.503 に答える
1

あなたはこれを行うことができます：

   $('.item_title:contains("Unique Title 2")').closest('.product_item').addClass('textFound').find('.item_price_label').html('<div class="new_stuff_here">Yay content here</div>');

デモ：Jsfiddle

于 2013-01-17T00:15:31.277 に答える
1

に関する上記の回答に加えて、.filterHTMLにはいくつかの修正が必要です。多くの要素に終了タグがないか、間違った終了タグがあります。

これがフィドルです

<div class="products">
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 1</div>
            <div class="item_price_box">
                <p class="item_price">
                    <div class="item_price_label">Price</div>
                    <div class="item_price_text">$265</div>
                </p>
          </div>
        </a>
    </div>
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 2</div>
            <div class="item_price_box">
                <p class="item_price">
                    <div class="item_price_label">Price</div>
                    <div class="item_price_text">$550</div>
                </p>
          </div>
        </a>
    </div>
    <div class="product_item">
        <a href="#">
            <div class="item_title">Unique Title 3</div>
            <div class="item_price_box">
                <p class="item_price">
                    <div class="item_price_label">Price</div>
                    <div class="item_price_text">$995</div>
                </p>
          </div>
        </a>
    </div>
</div>
于 2013-01-17T00:16:22.773 に答える