个人中心
gpt4 book ai didi

javascript - 这个脚本是否遵循通用标准？ (Javascript/HTML)

转载 作者：行者123 更新时间：2023-11-30 18:45:21 24 4
gpt4 key购买 nike

我刚刚在这里制作了一个简单的 Javascript 测验脚本:

/* Dade Lamkins.  2011. */

var Questions = [
    { Question: "What is 5+2?", Values: ["7", "9", "10", "6"], Answer: 1 },
    { Question: "What is the square root of 16?", Values: ["7", "5", "4", "1"], Answer: 3 },
    { Question: "What is the answer to life?", Values: ["7", "42", "4", "47"], Answer: 2 }
];

var currentSession={ Questions: [], TotalPoints: 0 }

var Letters = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];

function createQuestions(id) {
    var tReturn="<form style=\"text-align: left;width: 33.33333%;background-color: lightblue;border=1px solid #000000;padding: 10px\">";
    tReturn=tReturn+"<b>Questions "+(id+1)+":</b><br />&nbsp;&nbsp;&nbsp;&nbsp;<i>"+Questions[id].Question+"</i><br /><br />";
    for (var i=0;i<(Questions[id].Values).length;i++) {
        tReturn=tReturn+"<input onClick=\"checkAnswer("+id+","+i+",this)\" type=\"button\" value=\""+Letters[i]+"\" style=\"width:50px\" />. "+Questions[id].Values[i]+"<br />";
    }
    tReturn=tReturn+"</form>";
    return tReturn;
}

function updateScore() {
    var currentPoints=0;
    for (var i=0;i<currentSession.Questions.length;i++) {
        currentPoints+=currentSession.Questions[i].Score;
    }
    document.getElementById('quiz_score').innerHTML='%'+Math.round((currentPoints/currentSession.TotalPoints)*100);
}

function initializeQuiz() {
    for (var i=0;i<Questions.length;i++) {
        var elem=document.getElementById('quiz_section');
        currentSession.TotalPoints+=parseInt(elem.getAttribute('chances'));
        elem.innerHTML=elem.innerHTML+createQuestions(i)+"<br />";
        currentSession.Questions[i]={ Chances: elem.getAttribute('chances'), Answered: false, Score: parseInt(elem.getAttribute('chances')) };
    }
    updateScore();
}

function finalizeAnswer(bttn,c,questionId) {
    if (c) {
        bttn.parentNode.style.backgroundColor="lightgreen";
        bttn.parentNode.innerHTML="<b>QUESTION "+(questionId+1)+":</b> Correct!";
    } else {
        bttn.parentNode.style.backgroundColor="pink";
        bttn.parentNode.innerHTML="<b>QUESTION "+(questionId+1)+":</b> Wrong!";
    }
    updateScore();
}

function checkAnswer(questionId,answerId,bttn) {
    if (Questions[questionId].Answer==(answerId+1)) {
        finalizeAnswer(bttn,true,questionId);
        return 0;
    } else {
        bttn.setAttribute('value','x');
        bttn.setAttribute('disabled','true');
    }
    currentSession.Questions[questionId].Chances--;
    currentSession.Questions[questionId].Score--;
    if (currentSession.Questions[questionId].Chances<=0) {
        finalizeAnswer(bttn,false,questionId);
    } else {
        updateScore();
    }
}

然后你把这是另一个 html 页面:

<html>
    <head>
        <title>HTML QUIZ</title>
        <script language="javascript" src="Quiz.js"></script>
    </head>
    <body onload='javascript:initializeQuiz()' bgcolor="#CCFFFF">
        <b>Your Score Is Currently:  </b><span id="quiz_score"></span>
        <br />
        <br />
        <center><span style="width:100%" id="quiz_section" chances="1" quizid="1"></span></center>
    </body>
</html>

我的问题是，我在这里使用的所有方法都被普遍接受吗？

最佳答案

您对 innerHTML 的使用可能会让您受到 JavaScript 样式警察的访问，除此之外它看起来还不错。在客户端构建 HTML 的最安全可靠的方法是使用 document.createElement 制作 DOM 元素 https://developer.mozilla.org/en/DOM/document.createElement和 Node.appendChild https://developer.mozilla.org/En/DOM/Node.appendChild .

关于javascript - 这个脚本是否遵循通用标准？ (Javascript/HTML)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5639997/

24 4 0
文章推荐： javascript - 如何检测 flashblocker？
文章推荐： c - 为结构数组中的结构成员分配内存后写入无效
文章推荐： c# - CORBA 的 ASP.Net WebAPI 替代品？
文章推荐： c - 如何从 FILE* 写入 fd？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com