在一个词的不同的信件颜色 [英] Different letter colors in a word

问题描述

有没有任何解决方案来组合html，css和js一个一个地更改字母的字的颜色？
某种简单的方法，我是js中的新手。

Is there any solution to combine the html,css an the js to change the letters color's of a word, one by one? Some kind of easy method, I'm a newbie in the js.

推荐答案

假设你的HTML中有一段如下：

Suppose in your HTML, you have a paragraph as follows

<p id="my-par">Sentence</p>

您可以在javascript中执行此操作。将每个字母换成< span> 标记。

You can do this in javascript. Wrap each letter in a <span> tag.

var par = document.getElementById("myPar");
var colors = ["red", "blue", "green", "orange"];

par.innerHTML = par.innerHTML.split('').map(function(c) {
    return "<span class='" + colors[Math.floor(Math.random() * colors.length)] + 
    "'" + ">" + c + "</span>"
}).join('');

http://jsfiddle.net/ua9of1ux/1/

这篇关于在一个词的不同的信件颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！