クイズテストのスコアをポップアップなしのテキストとして取得する方法

Question

ブログでオンラインクイズを実装したいと思います。下のコードは、ユーザが表示結果をクリックするとすべてのオプションを選択した後、ポップアップとして結果スコアを表示した後です。

しかし、私は下の画像に示すように、フォーム自体にテキストとして結果として表示したいと思います。

var answers = ["A","C","B"], 
 
    tot = answers.length; 
 

 
function getCheckedValue(radioName){ 
 
    var radios = document.getElementsByName(radioName); // Get radio group by-name 
 
    for(var y=0; y<radios.length; y++) 
 
     if(radios[y].checked) return radios[y].value; // return the checked value 
 
} 
 

 
function getScore(){ 
 
    var score = 0; 
 
    for (var i=0; i<tot; i++) 
 
    if(getCheckedValue("question"+i)===answers[i]) score += 1; // increment only 
 
    return score; 
 
} 
 

 
function returnScore(){ 
 
    alert("Your score is "+ getScore() +"/"+ tot); 
 
}

<ul> 
 
    <li> 
 
    <h3>How many letters are there in "ZZ"?</h3> 
 
    <input type="radio" name="question0" value="A">2<br> 
 
    <input type="radio" name="question0" value="B">1<br> 
 
    <input type="radio" name="question0" value="C">3<br> 
 
    <input type="radio" name="question0" value="D">4<br> 
 
    </li> 
 
    <li> 
 
    <h3>How many letters are there in "ZZX"?</h3> 
 
    <input type="radio" name="question1" value="A">2<br> 
 
    <input type="radio" name="question1" value="B">1<br> 
 
    <input type="radio" name="question1" value="C">3<br> 
 
    <input type="radio" name="question1" value="D">4<br> 
 
    </li> 
 
    <li> 
 
    <h3>How many letters are there in "V"?</h3> 
 
    <input type="radio" name="question2" value="A">2<br> 
 
    <input type="radio" name="question2" value="B">1<br> 
 
    <input type="radio" name="question2" value="C">3<br> 
 
    <input type="radio" name="question2" value="D">4<br> 
 
    </li> 
 
</ul> 
 

 
<button onclick="returnScore()">View Results</button>

Answer 1

あなたはどこへ行くのスコアのためのDOM内の場所を確認する必要があります。

<div id="show-score"></div> 

returnscore関数を使用して、警告の代わりに結果を配置します。

function returnScore(){ 
    document.getElementById('show-score').innerHTML = 
     "Your score is "+ getScore() +"/"+ tot; 
} 

はフィドルを参照してください：https://jsfiddle.net/7Ly00p2z/