javascript - Document.write不会显示我想要的

所以我做了一个功能：

function dw (wrtext){
  document.write(wrtext)
}

然后这个：

function creditos(){
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;">------------------------------------------------</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> Preço Certo</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> ------------------------------------------------</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 1- 1º Jogo</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 2- 2º Jogo</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 3- 3º Jogo</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 4- Vencedor</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 5- Créditos</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: left;"> 0- Terminar</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Trabalho: Preço Certo</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Realização por: Duarte Nuno de Brito Arribas, Nº 07, 10º M;</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Escola Secundária Quinta das Palmeiras;</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Curso Profissional Técnico de Multimédia;</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Disciplina: Sistemas de Informação (S.I.);</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Módulo 3: Introdução à programação;</p>')
  dw('<p style="font-family: Arial; font-size: 15pt; font-weight: bold; text-align: right; margin-top: -300px"> Ano letivo: 2016-2017;</p>')
}

只是一堆带有样式的单词，但是由于第二个例外，由于某种原因，它不会显示很多。

任何帮助，将不胜感激！！！

预先加油和感谢！！！

最佳答案

如果可以的话，一些建议...


不要使用document.write。它已过时，现在是一种不好的做法。
不要重复自己（这些dw调用很糟糕）。
不要将HTML与CSS混合使用。避免使用style属性。
如果可以，请学习和使用ES6功能。


进行一些重构，您的代码将更具可读性：

function creditos() {
  document.body.innerHTML = `
    <div class="left">
      ------------------------------------------------<br>
      Preço Certo<br>
      ------------------------------------------------<br>
      <ol>
        <li>1º Jogo</li>
        <li>2º Jogo</li>
        <li>3º Jogo</li>
        <li>Vencedor</li>
        <li>Créditos</li>
        <li>Terminar</li>
      </ol>
    </div>
    <address class="right">
      Trabalho: Preço Certo<br>
      Realização por: Duarte Nuno de Brito Arribas, Nº 07, 10º M;<br>
      Escola Secundária Quinta das Palmeiras;<br>
      Curso Profissional Técnico de Multimédia;<br>
      Disciplina: Sistemas de Informação (S.I.);<br>
      Módulo 3: Introdução à programação;<br>
      Ano letivo: 2016-2017;<br>
    </address>`;
}

document.addEventListener('DOMContentLoaded', () => creditos());

p {
  font-family: Arial;
  font-size: 15pt;
  font-weight: bold;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}