Javascript jQuery，CSS：自动着色HTML列表？

如何自动为列表元素生成不同的背景色？

下面是静态

html

代码，应该以不同的背景色显示

没有机会手动添加

类

或

样式

，因此我认为使用jQuery是最简单的解决方案。这是我的第一次尝试：

$（文档）.ready（函数（）{
$（'.toc>ul>li'）。每个（函数（e）{
var n=$（this.children（）.text（）.length*2222；
var h=n.toString（16）.substr（0,6）；
$（this.css（{'background-color'：'#'+h}）；
//$（此）。追加（h）；
});
});

结果有点难看，并且有相似的颜色使得这个脚本无法使用

还有其他方法可以制作漂亮的自动彩色列表吗？

请参见本页：

我还用它制作了一把小提琴：

var字母='0123456789ABCDEF'。拆分（''）；
var color='#'；
对于（变量i=0；i<6；i++）{
颜色+=字母[Math.round（Math.random（）*15）]；
}
$（this.css（{'background-color'：''+color+''}）；

为了让东西看起来好看，你需要定义一组颜色。随意的颜色往往很糟糕

var clr = "000000,22222,44444,66666,88888,a0a0a0".split(",")
$('.toc > ul > li').each(function(){
      $(this).css('background-color',clr[$(this).index()])   
})

---

如果您正在寻找看起来有点类似（？）的随机颜色，您可能希望使用

hsl（）

来定义颜色

你可以像这样做

hsl( randomNumberBetween0and360, 100%, 50% );

然后得到一堆颜色，看起来它们是属于彼此的

下面是一个快速演示：

---

如果您需要对IE的支持，有一个很好的小脚本可以帮助您。

var n=$（this.children（）.text（）.length*2222；var h=n.toString（16）.substr（0,6）

这应该是一个随机的十六进制代码生成器吗？你能提供一些你希望它们如何着色的信息吗？e、 例如，随机、交替、遵循某些图案（彩虹）等。不使用随机，因为尝试根据内容使用固定颜色。遵循一些模式应该是很好的，或者使用一些预定义的漂亮的pantone颜色。

hsl( randomNumberBetween0and360, 100%, 50% );