Mostrar errores de console de JavaScript en la página

Digamos que tengo el siguiente código:

<script> function billy() { alert('muahahahaha!'); } function suzzy() { return; } </script> 

y un button como este (con un controller onclick indefinido):

 <input type='button' value='click me' onClick='FRANK()' /> 

Cuando hago clic en el button, aparece lo siguiente en la console de desarrollador:

La function 'FRANK ()' no está definida.

¿Cómo podría almacenar ese post en una variable y mostrarlo en la página?

 document.getElementById('prompt').innerHTML = log; 

Entonces, aparecerá como:

 <div id='prompt'> Function 'FRANK()' has not been defined. </div> 

Creo que la respuesta de @distroy es suficiente aquí, pero si quieres un manejo correcto de los errores, deberías usar en su lugar las declaraciones try y catch .

Manifestación

 function throw_msg() { try { var a = ''; alert(b); } catch(throw_error) { document.getElementById('error-box').innerHTML=throw_error.message; setTimeout( function() { document.getElementById('error-box').innerHTML=''; }, 2000); } } 

Explicación del código anterior:

Primero estamos creando una function que se llamará onclick en el button, y que onclick en el button, se ejecuta el código en el bloque try , si tiene algún error, entonces lanzamos el error usando la instrucción catch donde el post de error se imprime usando throw_error.message y al final, usamos setTimeout para borrar el post de error en 2000 es decir, 2 segundos

Si desea mostrar cualquier error de la página en su div, puede usar el controller de evento global onerror :

 window.onerror = function(e){ document.getElementById('prompt').innerHTML = e.toString(); } 

Demostración


Si su objective es interceptar todo lo que está escrito por el browser en la console, no solo los errores, no estoy seguro de que sea directamente posible ya que el browser no usa las funciones de console accesibles para todo.

Pero puedes hacer mucho conectando todos los manejadores de events globales:

Demostración