javascript - H1中的随机颜色词

Question

是否可以让 H1 中的每个单词都具有随机颜色，并且如果您刷新页面，这些单词将再次随机化？

我有 5 种颜色要使用。我将如何编码？

Answer 1

是的，这是可能的：

var colors = ['red', 'yellow', 'blue', 'green', 'black'];
$('h1').each(function(){
    $(this).html($(this).text().split(' ').map(function(v){
        return '<span style="color:'+colors[Math.floor(Math.random()*colors.length)]+'">'+v+'</span>';
    }).join(' '));
});​​​​​​

主要思想是将每个 h1 的内容拆分为单词并通过嵌入来替换单词，<span>因为您无法设置单词的样式，而只能设置元素的样式。

示范