单击提交后，使用typescript/javascript在单击时更改div的背景色_Javascript_Typescript

单击提交后，使用typescript/javascript在单击时更改div的背景色

javascript typescript

单击提交后，使用typescript/javascript在单击时更改div的背景色,javascript,typescript,Javascript,Typescript,每当我尝试在我的typescript和javascript文件中使用style.backgroundColor=“#F18C8E”时，它都不会起作用。尽管我很确定我是按照教程上说的那样做的。虽然我看到的很多教程都在.html文件中的标签中包含了脚本，所以我不确定这是否有什么不同。但是我必须使用一个链接的.js或.ts文件来完成这个任务使用typescript/javascript，在单击5个答案并提交后，如何将5个“correctDiv”答案的背景色更改为“#F18C8E” <!DOCT

每当我尝试在我的typescript和javascript文件中使用style.backgroundColor=“#F18C8E”时，它都不会起作用。尽管我很确定我是按照教程上说的那样做的。虽然我看到的很多教程都在.html文件中的标签中包含了脚本，所以我不确定这是否有什么不同。但是我必须使用一个链接的.js或.ts文件来完成这个任务

使用typescript/javascript，在单击5个答案并提交后，如何将5个“correctDiv”答案的背景色更改为“#F18C8E”

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" type="text/css" href="buzzfrog.css">
</head>
<body>
    <div class="container">
        <h1>BuzzFrog's Quiz Of The Day</h1>
        <!-- "Todays Topic not in mockup but need it for criteria dfsdfdsfsdfsdf-->
        <p>Today's Topic: Sports</p>
    </div>
    <form name="formContainer">

        <div class="div1">
            <h2>Who won the 2018 FIFA World Cup?</h2>
            <div class="row1">
                <div class="incorrectDiv"><h3><input type="radio" name="q1" value="0">Brazil</h3></div>
                <div class="incorrectDiv"><h3><input type="radio" name="q1" value="0">Germany</h3></div>
            </div>
            <div class="row2">
                <div class="correctDiv"><h3><input type="radio" name="q1" value="1">France</h3></div>
                <div class="incorrectDiv"><h3><input type="radio" name="q1" value="0">Spain</h3></div>
            </div>
        </div>

        <div class="div2">
            <h2>Who won the 2019 AFL Grand Final?</h2>
            <div class="row1">
                <div class="correctDiv"><h3><input type="radio" class="style" name="q2" value="1">Richmond</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q2" value="0">Greater Western Sydney</input></h3></div>
            </div>
            <div class="row2">
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q2" value="0">Geelong</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q2" value="0">Brisbane</input></h3></div>
            </div>
        </div>

        <div class="div3">
            <h2>Who won the men's 2020 Australian Open?</h2>
            <div class="row1">
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q3" value="0">Roger Federer</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q3" value="0">Dominic Thiem</input></h3></div>
            </div>
            <div class="row2">
                <div class="correctDiv"><h3><input type="radio" class="style" name="q3" value="1">Novak Djokovic</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q3" value="0">Rafael Nadal</input></h3></div>
            </div>
        </div>

        <div class="div4">
            <h2>Who won the 2019 UEFA Champions League?</h2>
            <div class="row1">
                <div class="correctDiv"><h3><input type="radio" class="style" name="q4" value="1">Liverpool</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q4" value="0">FC Barcelona</input></h3></div>
            </div>
            <div class="row2">
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q4" value="0">Real Madrid</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q4" value="0">Manchester United</input></h3></div>
            </div>
        </div>

        <div class="div5">
            <h2 class="h2small">The player to win the most FIFA World Player Of The Year awards is:</h2>
            <div class="row1">
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q5" value="0">Zinedine Zidane</input></h3></div>
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q5" value="0">Ronaldinho</input></h3></div>
            </div>
            <div class="row2">
                <div class="incorrectDiv"><h3><input type="radio" class="style" name="q5" value="0">Cristiano Ronaldo</input></h3></div>
                <div class="correctDiv"><h3><input type="radio" class="style" name="q5" value="1">Lionel Messi</input></h3></div>
            </div>
        </div>

    <div class="submitdiv">
        <button type="submit" id="submit" onclick="result()">SUBMIT</button>
    </div>
    </form>
</body>

<script type="text/javascript" src="dist/buzzfrog.js" ></script>

</html>


文件
BuzzFrog的当日测验
今天的话题：体育
谁赢得了2018年国际足联世界杯？
巴西
德国
法国
西班牙
谁赢得了2019年AFL总决赛？
里士满
大悉尼西部
吉隆
布里斯班
谁赢得了2020年澳网男子公开赛？
费德勒
多米尼克·蒂姆
德约科维奇
拉菲尔·纳达尔
谁赢得了2019年欧洲冠军联赛？
利物浦
巴塞罗那足球俱乐部
皇家马德里
曼彻斯特联队
获得国际足联年度最佳球员奖的球员是：
齐达内
罗纳尔迪尼奥
克里斯蒂亚诺·罗纳尔多
梅西
提交

函数结果（）{
var q1=parseInt（document.querySelector（'input[name=“q1”]：checked'）。值）；
var q2=parseInt（document.querySelector（'input[name=“q2”]：checked'）。值）；
var q3=parseInt（document.querySelector（'input[name=“q3”]：checked'）。值）；
var q4=parseInt（document.querySelector（'input[name=“q4”]：checked'）。值）；
var q5=parseInt（document.querySelector（'input[name=“q5”]：checked'）。值）；
let correct=document.queryselectoral（“correctDiv”）；
console.log（correct.length+“您可以这样做。请注意类名前面的
：
 let correct = document.querySelectorAll(".correctDiv");
    Array.from(correct).forEach(i=>{
     i.style.backgroundColor = "#F18C8E"
    })

@多米尼克1993我很乐意。如果有帮助，请接受答案。
 let correct = document.querySelectorAll(".correctDiv");
    Array.from(correct).forEach(i=>{
     i.style.backgroundColor = "#F18C8E"
    })