4

私はこのコードを使用しています

$('.list-item:nth-child(5n)').after('<div class="clear"><img src="http://domain.com/image.jpg" width="780" height="80" alt="banner" /></div>')

これは Firefox と Chrome では正常に動作しますが、IE8、IE9 では動作しません...

4

5 に答える 5

4

jQuery はnth-child、ネイティブ ブラウザ サポートがない場合の処理​​を行います。IE7、8、9+で問題なく動作します。

フィドル: http://jsfiddle.net/jonathansampson/Y3MP4/

于 2012-06-07T19:02:44.380 に答える
2

nth-childIE6-8ではサポートされていません。IE9はそれをサポートしています。ここを参照してください。

考えられる回避策については、この質問を参照してください。

于 2012-06-07T18:19:01.013 に答える
1

他に何か問題があるようです。コードはIE6でも機能するはずです。IE<9はn番目の子をネイティブにサポートしていませんが、jQueryのセレクターエンジン（Sizzle）が暗黙的に処理します。

このコードを試してみてください：

<script>
$("ul").remove();
var ul = $("<ul>");
for (var i = 1; i < 100; i++) {
  $("<li>", {
    "class" : "list-item",
    html : i
  }).appendTo(ul);
}
ul.appendTo(document.body);

$('.list-item:nth-child(5n)')
  .after('<div class="clear">Clear!</div>')
</script>

「クリア！」が見えますか？備考？IE6でも、次のことを行う必要があります...

于 2012-06-07T18:51:46.443 に答える
0

jQuery の nth-child セレクターは、IE8 の複雑なセレクターが関係するまれなケースでは機能しません。

以下は、IE8 で変更する必要がありました。

//Works fine in IE9+, FF and Chrome. 
//dataColumn = jQuery('.table-header div.rf-edt-hdr + div table table tbody > tr:nth-child(1) td:nth-child(1)');
//headerColumn = jQuery('div.table-header > div.rf-edt-hdr table table > tbody > tr td:nth-child(1)');
dataColumn = jQuery('.table-header div.rf-edt-hdr + div table table tbody > tr').eq(0).find('td').eq(0);
headerColumn = jQuery('div.table-header > div.rf-edt-hdr table table > tbody > tr td').eq(0);

注:nth-child は 1 インデックス ベースです。eq() は 0-index ベースです。

于 2014-06-26T09:41:56.823 に答える
0

実際には、js フォルダーにアップロードしてヘッダーにいくつかの条件を追加できるスクリプトがあり、nth-child は IE 6、7、および 8 で動作します。詳細については、こちらを参照してください。丸みを帯びた角を使用する必要がある場合は、 curvycorners.js と呼ばれるこの別のスクリプトをインストールすると、本当に時間が節約されます。幸運を

于 2012-12-19T21:26:42.270 に答える