标题的颜色效果

【问题标题】：Color effect for headlines标题的颜色效果
【发布时间】：2017-04-10 06:14:21
【问题描述】：

我正在寻找创建一个函数，该函数采用标题并计算其字长以将其分成 3 个单独的跨度。

每个跨度都会应用一个独特的样式。

示例：

<span style="color:red">Hea</span>
<span style="color:blue">dli</span>
<span style="color:green">ne</span>

任何帮助实现此效果而不是手动完成都会很棒。

【问题讨论】：

顺便说一句，那些颜色是无效的。选择十六进制或书面实现

标签： jquery

【解决方案1】：

我会结合使用substr 函数和.html()。

headline = "Terminator";
sub = Math.floor(headline.length/3);
first = headline.substr(0,sub);
second = headline.substr(sub,sub);
third = headline.substr(sub*2);

$("<span style='color:red'>").html(first).appendTo("body");
$("<span style='color:blue'>").html(second).appendTo("body");
$("<span style='color:green'>").html(third).appendTo("body");

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

【讨论】：

这肯定不能回答问题，因为这是基于字符长度而不是问题中指定的单词长度？