First of all, if the developer wants to use one of capabilities of the javaScript - it is necessary to prepare the main idea of entire application and design how it should work.
After that the commands and calculations to be performed should be wrapped in the functions with it's name and parameters.
For example function buildQuiz()
function buildQuiz(){
// we'll need a place to store the HTML output
const output = [];
// for each question...
myQuestions.forEach(
(currentQuestion, questionNumber) => {
// we'll want to store the list of answer choices
const answers = [];
// and for each available answer...
for(letter in currentQuestion.answers){
// ...add an HTML radio button
answers.push(
`<label>
<input type="radio" name="question${questionNumber}" value="${letter}">
${letter} :
${currentQuestion.answers[letter]}
</label>`
);
}
// add this question and its answers to the output
output.push(
`<div class="question"> ${currentQuestion.question} </div>
<div class="answers"> ${answers.join('')} </div>`
);
}
);
// finally combine our output list into one string of HTML and put it on the page
quizContainer.innerHTML = output.join('');
}
This function store the answer choices,adds HTML radio button for each question, adds question and answers to the output and finally combine output into HTML string and display as results on the page
Have you had any issues with the progress of your app? This clearly shows progress at a good level.
ReplyDelete