如何使用javascript将字体显示为选定颜色？

我有一个div，当你点击create按钮时，它会显示一种字体。我想这样，当我从下拉列表中选择特定颜色时，字体将以该颜色显示。以下是html颜色表单：

<div class="formbox">
                <label for="colourSelect">Your Colour:</label>
                <select name="colourSelect" id="colourSelect">
                    <option value="X">Chooose a colour</option>
                    <option value="R">Red</option>
                    <option value="O">Orange</option>
                    <option value="Y">Yellow</option>
                    <option value="G">Green</option>
                    <option value="B">Blue</option>
                    <option value="P">Purple</option>
                </select>
            </div>

---

使用onchange作为下拉列表，并使用this.value将参数传递给javascript

示例代码：onchange=“font（this.value）”

在Javascript中，像这样编写您的条件

var color;
if(value=="R"){
   color=Red
}
if(value=="Y"){
   color=Yellow
}

document.querySelector("#display").style.color=color; //assign the color here.

你需要一个听众：

如果我们的HTML是，请说：

<select id="colorSelect" onChange="update()">
    <option>red</option>
    <option>blue</option>
</select>

<div id="text">My text</div>

函数kk（）{
var aa=document.getElementById（'colorSelect'）；
var gg=document.getElementById（'txt'）
var bb=aa.options[aa.selectedIndex].text
开关（bb）{
大小写“Red”：aa.style.color=“Red”//这将改变内部文本的颜色
打破
案例“Orange”：gg.style.color=“Orange”//这将改变内部的颜色
打破
案例“黄色”：aa.style.color=“黄色”；
打破
}
}
您的颜色：
选择颜色
红色
橙色
黄色的
绿色
蓝色
紫色

---

将更改颜色

样式。颜色
是用于更改文本颜色的属性。你试过了吗？你的问题有点不清楚你在找什么。很抱歉，我有一个显示div，在点击提交按钮后显示所选字体（使用单选按钮选择）。现在我只想从列表中选择一种颜色，然后当我显示字体时，它应该显示为我选择的任何颜色。
<select id="colorSelect" onChange="update()">
    <option>red</option>
    <option>blue</option>
</select>

<div id="text">My text</div>

var select = document.getElementById("colorSelect");
var text = document.getElementById("text");

function update(){
    text.style.color = select[select.selectedIndex].value;
}

<script>
function kk(){

var aa = document.getElementById('colourSelect');
var gg = document.getElementById('txt')
var bb = aa.options[aa.selectedIndex].text

switch(bb){

case "Red" : aa.style.color = "red"; // this will change color of txt inside <option>
break;

case "Orange" : gg.style.color = "orange";//this will change color inside <p>
break;

case "Yellow" : aa.style.color = "yellow";
break;
}
}
</script>
<div class="formbox">
                <label for="colourSelect">Your Colour:</label>
                <select name="colourSelect" id="colourSelect" onchange="kk()">
                    <option value="X" >Chooose a colour</option>
                    <option value="R" >Red</option>
                    <option value="O">Orange</option>
                    <option value="Y">Yellow</option>
                    <option value="G">Green</option>
                    <option value="B">Blue</option>
                    <option value="P">Purple</option>
                </select>
            </div>