3

対処しなければならない恐ろしいコードがあります

...
<div class="container">
   ...
    <tr>
    <td width="100" height="50">
         <a class="swaps"><img src="http://www.blah.jpg" alt="Some Title" id="1"></a></span></td>
    </tr>
   <tr>
    <td width="100" height="50">
        <a class="swaps"><img src="http://www.blah2.jpg" alt="Another title" id="2"></a></span></td>
    </tr>
</div>

私が使用する場合

var thisone = $("#container .swaps:first")

最初のもの (ID 1) を選択するには、なぜ選択に問題があるのですか?

thisone.next()?

4

8 に答える 8

4

HTMLは本物ですか？ID「コンテナ」の要素が表示されず、あなたはやっています

$("#container .swaps:first")

また、本物のHTMLなら少し直したほうがいいです（imgタグを閉じて、</TD>の前にspanの開始タグを追加）

HTML に問題がないと仮定すると、これはシナリオで機能するはずです。

var thisone = $("#container .swaps:first");
thisone.children();

IMG はアンカーの兄弟ではなく、子です。

于 2010-04-07T03:17:28.860 に答える
1

jQuery のnext()関数は、一致したすべての要素について、(jQuery の結果セットではなく) DOM ツリーに表示される次の兄弟を返します。そう呼ぶ

$("#container .swaps:first")

最初のアンカーを取得し、それを呼び出すと、next()次の兄弟がないため undefined が返されます。を呼び出してノードに連続してアクセスしたい場合は、 Iterator パターンを実装するとよいと思いますnext()。

jQuery オブジェクトは項目の配列です。現在のインデックスを変数に格納し、次の要素を取得した後にインクリメントすることができます。

// Naive way
var items = $("#container .swaps");
var i = 0;
items[i++] // first <a>
items[i++] // second <a>

Iterator パターンを使用して上記の機能をラップする 2 つの実装を次に示します。1 つは jQuery プラグインとして機能し、もう 1 つは基本的に別の関数です。どちらも同じように動作します:

// Iterator function
function Iterator(list) {
    var results = list;
    var i = 0;

    this.next = function() {
        return results[i++];
    };

    return this;
}

// Usage
var iterator = Iterator($("#container .swaps"));
iterator.next() // first <a>
iterator.next() // second <a>

2 番目のものは最初のものとほとんど同じですが、代わりに jQuery プラグインが使用されます。

// jQuery plugin
$.fn.iterator = function() {
    var i = 0;

    this.next = function() {
        return this[i++];
    };

    return this;
};

// Usage
var iterator = $("#container .swaps").iterator();
iterator.next() // first <a>
iterator.next() // second <a>

Javascript 1.7 には、これを行うためのジェネレーターとイテレーターに優れた機能がいくつかありますが、まだ普及していません。私の知る限り、Firefox だけがサポートしています。

于 2010-04-07T19:56:06.287 に答える
1

なぜなら、Jquery docs が言うように：

:first 疑似クラスは :eq(0) と同等です。:lt(1) と書くこともできます。これは 1 つの要素のみに一致しますが、:first-child は複数の要素に一致する可能性があります: 親ごとに 1 つです。

のように使用.children() してみてください$(selector).children();

于 2010-04-07T03:17:45.193 に答える
1

next() メソッドは兄弟の一致をチェックします...あなたのシナリオでは、.swaps クラスを持つ他の兄弟はありません... $("#container .swaps") を試してください

于 2010-04-07T03:19:02.540 に答える
0

セレクターは

var thisone = $("div.container a.swaps:first");
var img = thisone.children(img);

また、IDが無効です。IDを数字で始めることはできません。

于 2010-04-07T06:31:18.983 に答える
0

:firstセットを 1 つに削減するを使用しているため、「次」はありません。:first-child代わりに使用してみてください。

于 2010-04-07T03:16:10.630 に答える
0

あなたの例thisone.next()では、元の選択に（同じレベルの）兄弟がいないため、実際には何も得られません。必要なのは、の子thisone、つまり img であり、 を使用してthisone.children("img")います。

于 2010-04-07T03:16:40.880 に答える
0

まず、あなたのコードではないことはわかっていますが、ID は決して数字で始まったり、数字だけを含んだりしてはいけません。

何をしようとしているのかはわかりませんが、次の.swapsように繰り返すだけで簡単になると思います。

$('#container .swaps').each(function(){
 var swapImg = $(this).find('img');
 // do something else
})
于 2010-04-07T13:47:50.133 に答える