Question

我正在使用此代码

$('.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中无效...

Answer 1

jQuery在没有本机浏览器支持的情况下处理nth-child。它在IE 7,8和9 +中工作正常。

小提琴：http://jsfiddle.net/jonathansampson/Y3MP4/

Answer 2

IE 6-8不支持

nth-child。 IE9支持它。请参阅here。

有关可能的解决方法，请参阅this question。

Answer 3

听起来还有其他不妥之处。您的代码甚至可以在IE6中运行 - 虽然IE＆lt; 9本身不支持nth-child，但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中，你也应该......

Answer 4

实际上有一个脚本，您可以在js文件夹中上传并在标题中添加一些条件，nth-child将在IE 6,7和8中运行。您可以了解更多here如果需要使用圆角，你需要安装另一个名为curvycorners.js的脚本他们真的很节省时间。祝你好运

Answer 5

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索引的。

jQuery：nth-child不在IE中工作

5 个答案:

jQuery：nth-​​child不在IE中工作

5 个答案:

jQuery：nth-child不在IE中工作