检测类名为x的最后一个div，并添加一个新类y

Question

我想知道，这是确定最后一个div并向其中添加新类的最佳方式。它是JavaScript还是css3？

所以这里是我的例子。假设我有这个：

<div class="items"> 
    <div class="raw">item 1</div> 
    <div class="raw">item 2</div> 
    <div class="raw">item 3</div> 
    <div class="raw">item 4</div> 
    <div class="raw">item 5</div> 
    <div class="raw">item 6</div> 
</div> 

怎么样？什么方法？我可以添加到类名为“raw”的最后一个div的新类名“new”？

使之成为：

<div class="raw new">item 6</div> 

Answer 1

刚：

$('div.raw:last').addClass('new'); 

Answer 2

在jQuery中那样简单：

$(".items > .raw:last").addClass("new"); 

在纯JavaScript和querySelector：

document.querySelector(".items > .raw:last-child").className += " new"; 

Answer 3

$('div.raw:last').addClass('new'); 

Answer 4

您可以通过纯CSS去：

div.raw:last-child { 
    /* styles for the last element here */ 
} 

，或者，如果你需要一个子集

div.raw:last-of-type { 
    /* styles for the last element here */ 
} 

以防万一，新类中更具体（-名称）不是强制性的。

这两个伪选择器都与最新的W3C浏览器兼容。 IE开始于9.如果你迫切希望支持IE7 +，我推荐这个小小的lib：https://code.google.com/p/ie7-js/