javascript - 如何制作字母表特定颜色的javascript颜色字母

Question

<分区>

Answer 1

下面是一个使用 javascript 的简单示例。

const container = document.getElementById("container");
const container2 = document.getElementById("container2");
const letters = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'];
const colors = ['#FFAA00', '#DDAA00', '#FFFA00', '#FFAAAA', '#121212', '#F1D3A4', '#FAAA43', '#459878', '#234578', '#ADAEAF', ];
letters.forEach((letter) => {
  const elem = document.createElement('span');
  const r = Math.random() * 255;
  const g = Math.random() * 255;
  const b = Math.random() * 255;
  elem.innerText = letter;
  elem.style.color =  'rgb('+r+','+g+','+b+')';
  container.appendChild(elem);
});
letters.forEach((letter, index) => {
  const elem = document.createElement('span');
  elem.innerText = letter;
  elem.style.color = colors[index];
  container2.appendChild(elem);
});

body {
  font-size: 2em;
}

<div id="container"></div>

<div id="container2"></div>