Pagination 专门针对生成的分页

Pagination 专门针对生成的分页,pagination,css-selectors,Pagination,Css Selectors,我只需要针对ul中的特定li,但我无法添加类来解决我的问题。我想有一种方法可以使用Javascript,但这将是我最后的选择。 解释: <div> <ul> <li>Start</li> <li>Previous</li> <li>>1</li> <!--need to target this--> <li

我只需要针对ul中的特定li,但我无法添加类来解决我的问题。我想有一种方法可以使用Javascript,但这将是我最后的选择。 解释:

<div>
    <ul>
        <li>Start</li>
        <li>Previous</li>
        <li>>1</li> <!--need to target this-->
        <li>2</li> <!--need to target this-->
        <li>3</li> <!--need to target this-->
        <li--in future a new li will be generated--/li>
        <li>Next</li>
        <li>End</li>
    </ul>

  • 开始
  • 先前的
  • >1
  • 2
  • 3
  • 下一个
  • 结束
这个例子只是一般的想法,因为我的JSFIDLE包含更多的信息,比如span和类。


注意:我查找了和选择器,但找不到一个适合我的情况。

最好将类分配给您可以控制的元素,例如开始、上一个、下一个和结束。完成此操作后,可以很容易地为其他元素设置样式

<ul>
    <li class="static">Start</li>
    <li class="static">Previous</li>
    <li>>1</li> <!--need to target this-->
    <li>2</li> <!--need to target this-->
    <li>3</li> <!--need to target this-->
    <li--in future a new li will be generated--/li>
    <li class="static">Next</li>
    <li class="static">End</li>
</ul>
这将是最直接的解决方案。但是,如果您不能将这些类添加到“静态”LI标记中,但您知道DOM结构看起来是相同的,那么请使用CSS,如以下所示:

UL LI {
    color: green;
}
UL LI:first-child,
UL LI:nth-child(2),
UL LI:nth-last-child(2),
UL LI:last-child {
    color: red;
}

已经找到了,这是愚蠢的问题,但你首先回答了,所以你应得的。
UL LI {
    color: green;
}
UL LI:first-child,
UL LI:nth-child(2),
UL LI:nth-last-child(2),
UL LI:last-child {
    color: red;
}