Skip to main content
1 de 5
Largato
  • 92,9mil
  • 18
  • 190
  • 261

Problema 1:

Normalmente document.write é usado em JS para compor partes de uma página durante sua carga.

Ocorre que sua função está sendo chamada depois do HTML original já ter sido servido e o DOM já montado. Isso faz com que implicitamente, na primeira ocorrência, seja chamado um document.open, efetivamente sobreescrevendo o documento original.

Problema 2:

Mesmo resolvendo esta parte, ainda tem o problema do botão enviar o form (é o comportamento do button), o que pode não ser desejável nesse caso.

Solução substituindo o document.write por innerHTML:

Uma possível solução para criar HTML é substituindo o conteúdo de um elemento, por exemplo desta forma:

function Gerar() {
  output = document.getElementById('output');
  output .innerHTML = '<table>';          // Primeiro usamos =
  output .innerHTML += '<tr>';            // depois += para acrescentar
  output .innerHTML += '<td>celula</td>';
  output .innerHTML += '</tr>';
  output .innerHTML += '</table>';
}
<body>
  <div id="titulo">
    <h1>Caça-Palavras</h1>
    <form>
      Conteudo da pagina<br>
      <button type="button" onClick="Gerar()">Gerar</button>
      <div id="output"></div>
    </form>
  </div>
</body>
</html>

Largato
  • 92,9mil
  • 18
  • 190
  • 261