CSS优先级原则（jquery css给文本增加随机色彩）

1、css代码（注意优先级权重）

/* 样式的优先级
        内联样式表的权值最高 1000；ID 选择器的权值为 100；Class 类选择器的权值为 10；HTML 标签选择器的权值为 1。
        优先原则：选择器都有一个权值，权值越大越优先；当权值相等时，后出现的样式表设置要优于先出现的样式表设置；
        创作者的规则高于浏览者：即网页编写者设置的CSS 样式的优先权高于浏览器所设置的样式； 继承的CSS 样式不如后来指定的CSS 样式；
        在同一组属性设置中标有“!important”规则的优先级最大；
 */
.page-content .content-item .table a.c1{color: #d78a2f !important;}/* 优先级最大 */
.page-content .content-item .table a.c2{color: #9307db !important;}
.page-content .content-item .table a.c3{color: #d2d42e !important;}
.page-content .content-item .table a.c4{color: #41c13a !important;}
.page-content .content-item .table a.c5{color: #0785db !important;}
.page-content .content-item .table a.c6{color: #7cc67b !important;}
.page-content .content-item .table a.c7{color: #07dbd4 !important;}

2、js代码

// 遍历a标签
$(".page-content .content-item .table a").each(function(index){
	$(this).addClass("c"+randValue());
//	$(this).css('color','#41c13a');
})

//生成1~7的随机数
function randValue() {
   return (Math.floor(Math.random() * 7) + 1);
}

3、jsp代码

<div class="page-content">
        <div class="content-item jkzx">
            <div class="title">
                <div class="text fl">疾病</div>
            </div>
            <div>
            	<table class="table">
            	<c:forEach items="${sicknessMap.entrySet()}" var="sickEntry" varStatus="curStatus">
	            	<c:if test="${(curStatus.index)%2 == 0}">
	            		<tr>
	            	</c:if>
            				<td class="t"><a>${sickEntry.getKey()}</a></td>
            				<td class="l">
            					<c:forEach items="${sickEntry.getValue()}" var="sickMap" >
            						<a href="${ctx}/info/index/${sickMap.SICK_ID}">${sickMap.SICK_NAME}</a>
            					</c:forEach>
            				</td>
	            	<c:if test="${(curStatus.index)%2 == 1}">
	            		</tr>
	            	</c:if>            	
            	</c:forEach>
                </table>
            </div>
        </div>
</div>

4.效果