jQuery的：第n个孩子在IE

问题描述：

$('.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不工作...

反正IEAI不支持AFAIK nth-child。 –

@pixelngrain请将您的HTML文件发布到'.list-item'元素。同时发布您可能在控制台中看到的任何消息。 – Sampson

我检查并没有在IE中工作。不知道错在哪里 –

答

jQuery处理nth-child缺乏本地浏览器支持。它在IE7,8和9+中工作得很好。

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

答

nth-child不支持IE 6-8。 IE9支持它。见here。

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

jQuery在缺乏本地浏览器支持的情况下处理'n-child'。 – Sampson

答

听起来好像还有其他不妥之处。即使在IE6中你的代码也应该可以工作 - 尽管IE < 9本身不支持nth子，但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中，你也应该...

如何更改此代码的div？ –

答

实际上，有，你可以在你的js文件的文件夹，并添加在你的头和第n个孩子的一些条件语句会在IE 6，7工作，8，你可以了解一个脚本的详细here和如果您需要使用圆角，则需要安装另一个名为curvycorners.js的脚本。它们确实节省时间。祝你好运

答

jQuery的nth子选择器不能在一些涉及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的：第n个孩子在IE

相关推荐