En este caso lo que estoy queriendo lograr es ingresar el valor en el input y ver el resultado eso se ejecuta y se muestra correctamente el problema es que al darle click me mustra solo el resultado de la operacion pero no los titulos ej.: 
 Curso de Javascript
 Ejercicio de tabla de multiplicar
y la tabla

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

       
          function multiplicar() {
            let cabeza = document.getElementById("cabecera").innerHTML;
            let input = document.getElementById("numero").value;
            let contador = 2;

            document.write(cabeza + "</br>");
      
      while (contador <= 10) {
              document.write( input + " x " + contador + " = " + contador * input + "</br>");
              contador++;
            }
          
    }
           
         
        

<!-- language: lang-html -->

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
        <link rel="stylesheet" href="style.css" />
      </head>
      <body>
        <div id="cabecera">
        <h1>Curso de Javascript</h1>
        <h3>Ejercicio de tabla de multiplicar</h3>
        <form>
          <input type="number" id="numero" />
          <button  onclick="multiplicar()">Consultar</button>
          </div>
          <br/><br/>
        </form>
          </body>
    </html>



<!-- end snippet -->