我做了这个心理测试:
<p>Q1: What do you think about XYZ?</p>
<input type="radio" name="group1" id="A1"> Agree strongly<br/>
<input type="radio" name="group1" id="E1"> Disagree very much<br/>
<p>Q1: What do you think about ABC?</p>
<input type="radio" name="group2" id="A2"> Agree strongly<br/>
<input type="radio" name="group2" id="E2"> Disagree very much<br/>
<button onclick="myFunction()">GET RESULTS</button>
<script>
counter = 0;
function myFunction() {
if (document.getElementById('A1').checked){
counter = counter - 2;
} else if (document.getElementById('E1').checked) {
counter = counter + 2;
}
if (document.getElementById('A2').checked){
counter = counter - 2;
} else if (document.getElementById('E2').checked) {
counter = counter + 2;
}
if (counter > 0) {
document.write("Its positive!");
} else {
document.write("Its negative!");
}
}
</script>
单击“获取结果”按钮时,结果会正确显示,但没有应用CSS样式。我该怎么做才能使结果显示在样式页面上?谢谢!
答案 0 :(得分:1)
因为您使用了document.write
。
当您使用document.write
整个文档,头部,正文时,所有内容都会被您编写的内容所取代。因此,如果您使用它,则需要重新创建完整的文档。
标准建议适用:从不使用document.write()
。转而学习innerHTML
(之后阅读其余的DOM API)。