How to rewrite html document with javascript

Question

I Would like rewrite an update a document html, with some info getting from javascript.

<html>
<head>
<title>App</title>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />
<script type="text/javascript" src="quiz.js"></script> 
</head>

<body>          

<form id="test">
<table border="1" cellpadding="5" cellspacing="0">


//q3 and q2, follow the same schema
<tr>
<td>q3?</td>
<td>
    <input name="q4" type="radio" value="false"/>
    S<br>
    <input name="q4" type="radio" value="false"/>
    Sa<br>
    <input name="q4" type="radio" value="true"/>
    Re
</td>
</tr>

</table>
<br/>
<input name="submit" type="button" onClick="gradeTest()" value="Comprueba"/>
</form> 
</body>
</html>

And my javascript file, quiz.js

function gradeTest() {
//variables with global implications
var totalQuestions = 3;
var correctAnswers = 0;
var alertText;
var i;

//iterate through all options in radio button list
//if checked value is true, answer is correct
var a2 = document.getElementsByName('q2');
for(i = 0; i < a2.length; i++) {
    if(a2[i].checked) {
        if(a2[i].value == 'true') {
            correctAnswers++;
            break;
        }
    }
}


var a3 = document.getElementsByName('q3');
for(i = 0; i < a3.length; i++) {
    if(a3[i].checked) {
        if(a3[i].value == 'true') {
            correctAnswers++;
            break;
        }
    }
}

var a4 = document.getElementsByName('q4');
for(i = 0; i < a4.length; i++) {
    if(a4[i].checked) {
        if(a4[i].value == 'true') {
            correctAnswers++;
            break;
        }
    }
}


if(correctAnswers==3)
    document.write("OK");

The problem was, when i tried to use document.write that generate a new document only with "OK", but i want print this ok in the html with all information.

Don't use document.write. Instead, use DOM APIs.

SLaks
– SLaks

2016-05-12 18:33:14 +00:00
Commented May 12, 2016 at 18:33 — SLaks
– SLaks, Commented May 12, 2016 at 18:33
document.write overwrites everything don't use it

Steve
– Steve

2016-05-12 18:35:14 +00:00
Commented May 12, 2016 at 18:35 — Steve
– Steve, Commented May 12, 2016 at 18:35

André Dion · Accepted Answer · 2016-05-12 18:36:09Z

2

You want to append to the DOM. Something like

document.body.appendChild(document.createTextNode('OK'));

See Node.appendChild() and Document.createTextNode().

answered May 12, 2016 at 18:36

André Dion

21.8k7 gold badges59 silver badges60 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user243380 Over a year ago

this solve my problem, but just one more question, how is possible put in this example OK at the begging of the website(html), thank you :D @André Dion

hungerstar Over a year ago

Use Node.insertBefore(). Get a reference to the first child of <body> and insert your OK node before it.

Collectives™ on Stack Overflow

How to rewrite html document with javascript

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related