js實現顏色隨機的標籤列表 原

效果圖如下圖:

html 的代碼如下

<html>
<body>
<p class="blog-post-meta">
    <span class="label">no.1</span> 
    <span class="label">no.2</span>
    <span class="label">no.3</span>
    <span class="label">no.4</span>
</p>
</body>
</html>

javascript中先提前預設好變量,之後隨機選取一個作爲span的類,即可實現顏色隨機的標籤列表

$(function(){

	//爲標籤附顏色
	var tagClass = ["label-default","label-primary","label-success","label-warning","label-danger","label-info"];
	
	$(".blog-post-meta > span").each(function(i){
		var index = Math.floor(Math.random()*tagClass.length);
		$(this).addClass(tagClass[index]);
	})
};
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章