使用 JQ 或 CSS 为每个 X 元素添加一个 div答案

【问题标题】：Add a div every X element using JQ or CSS使用 JQ 或 CSS 为每个 X 元素添加一个 div
【发布时间】：2012-08-24 03:46:04
【问题描述】：

我有很多 div，比如说 10 个，我想每隔 4 个元素添加一个具有特定类的新 div。谁能告诉我如何使用 JQ 或 CSS 来做到这一点？我更喜欢 JQ，因为我想让它充满活力。

先谢谢了！对不起我的英语不好......

【问题讨论】：

【解决方案1】：

$('<div/>').addClass('someclassname').html('somehtml').insertAfter('div:nth-child(4n)');

【讨论】：

【解决方案2】：

@AshirvadSingh 解决方案是正确的，可能是最好的解决方案。不过，为了完整起见，您实际上可以使用纯 css 来完成。从技术上讲，您实际上并没有插入新的 div，但效果是相同的，并且您将拥有所有相同的样式选项。 CSS 看起来像这样：

div:nth-child(4n):after {
   content: 'b';
   display: block;
   color: green;   
}

我更新了@AshirvadSingh fiddle 来演示：http://jsfiddle.net/rjW7u/1/

jQuery 解决方案的优点是它可能在不支持我使用的伪选择器的旧浏览器中工作得更好。另一方面，css 解决方案仍然适用于禁用 js 的人。

【讨论】：