Scribd Logo
Upload

Welcome to Scribd!

  • 18 views

    EX 4 IP - PDF

    Uploaded by

    Norah C
    1. The document describes creating an online exam using JavaScript by defining an array of question objects in a JavaScript file linked to an HTML file. 2. It initializes variables to track the current question and user's score, and includes functions to display questions, handle answers, and calculate the final score. 3. DOM manipulation is used to dynamically update the HTML elements and add event listeners to trigger the necessary functions when the user submits answers.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    EX 4 IP - PDF

    Uploaded by

    Norah C
    18 views5 pages
    1. The document describes creating an online exam using JavaScript by defining an array of question objects in a JavaScript file linked to an HTML file. 2. It initializes variables to track the current question and user's score, and includes functions to display questions, handle answers, and calculate the final score. 3. DOM manipulation is used to dynamically update the HTML elements and add event listeners to trigger the necessary functions when the user submits answers.

    Original Description:

    Original Title

    EX 4 IP_pdf

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    1. The document describes creating an online exam using JavaScript by defining an array of question objects in a JavaScript file linked to an HTML file. 2. It initializes variables to track the current question and user's score, and includes functions to display questions, handle answers, and calculate the final score. 3. DOM manipulation is used to dynamically update the HTML elements and add event listeners to trigger the necessary functions when the user submits answers.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    18 views5 pages

    EX 4 IP - PDF

    Uploaded by

    Norah C
    1. The document describes creating an online exam using JavaScript by defining an array of question objects in a JavaScript file linked to an HTML file. 2. It initializes variables to track the current question and user's score, and includes functions to display questions, handle answers, and calculate the final score. 3. DOM manipulation is used to dynamically update the HTML elements and add event listeners to trigger the necessary functions when the user submits answers.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 5

    Ex.

    No 4

    Aim: Create an HTML page to display an online exam using JavaScript.

    Algorithm:

    1. Create an HTML file and name it "online_exam.html".

    2. Inside the HTML file, add the necessary elements such as headings, questions, options, buttons, and result
    display area.

    3. Link the HTML file to a JavaScript file named "script.js" using the <script> tag.

    4. In the JavaScript file, define an array of objects to store the questions, options, and correct answers.

    5. Initialize variables to keep track of the current question index and the user's score.

    6. Create functions to display the current question, handle the user's answer, and calculate the score.

    7. Use DOM manipulation to dynamically update the HTML elements with the question, options, and result.

    8. Add event listeners to handle button clicks and trigger the necessary functions.

    9. Once all questions have been answered, display the final score.

    Coding:

    online_exam.html:

    <!DOCTYPE html>

    <html>

    <head>

    <title>Online Exam</title>

    <script src="script.js"></script>
    </head>

    <body>

    <h1>Online Exam</h1>

    <div id="question"></div>

    <div id="options"></div>

    <button id="submit">Submit Answer</button>

    <div id="result"></div>

    </body>

    </html>

    script.js:

    // Array to store questions, options, and correct answers

    var questions = [

    question: "What is the capital of France?",

    options: ["London", "Paris", "Rome", "Berlin"],

    answer: 1

    },

    question: "Which planet is known as the Red Planet?",

    options: ["Mars", "Jupiter", "Saturn", "Venus"],

    answer: 0

    },

    {
    question: "Who painted the Mona Lisa?",

    options: ["Leonardo da Vinci", "Pablo Picasso", "Vincent van Gogh", "Michelangelo"],

    answer: 0

    ];

    var currentQuestionIndex = 0;

    var score = 0;

    function displayQuestion() {

    var questionElement = document.getElementById("question");

    var optionsElement = document.getElementById("options");

    var currentQuestion = questions[currentQuestionIndex];

    questionElement.textContent = currentQuestion.question;

    optionsElement.innerHTML = ""; // Clear previous options

    for (var i = 0; i < currentQuestion.options.length; i++) {

    var option = document.createElement("input");

    option.type = "radio";

    option.name = "answer";

    option.value = i;
    optionsElement.appendChild(option);

    var label = document.createElement("label");

    label.textContent = currentQuestion.options[i];

    optionsElement.appendChild(label);

    optionsElement.appendChild(document.createElement("br"));

    function handleAnswer() {

    var selectedOption = document.querySelector('input[name="answer"]:checked');

    if (selectedOption) {

    var answer = parseInt(selectedOption.value);

    if (answer === questions[currentQuestionIndex].answer) {

    score++;

    currentQuestionIndex++;

    selectedOption.checked = false;
    if (currentQuestionIndex < questions.length) {

    displayQuestion();

    } else {

    displayResult();

    function displayResult() {

    var resultElement = document.getElementById("result");

    resultElement.textContent = "Your score: " + score + " out of " + questions.length;

    // Event listener for the submit button

    document.getElementById("submit").addEventListener("click", handleAnswer);

    // Start the exam

    displayQuestion();

    Output: Screeshot

    Result : The above experiment has completed successfully

    You might also like