Question

我们说我有以下代码：

<script>

    function billy() {
        alert('muahahahaha!');
    }

    function suzzy() {
        return;
    }

</script>

和这样的按钮（带有未定义的onclick处理程序）：

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

单击该按钮时，开发人员控制台中将显示以下内容：

功能＆＃39; FRANK（）＆＃39;没有定义。

如何将该消息存储在变量中并将其显示在页面上？

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

所以它会显示为：

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

Answer 1

如果您想在div中显示页面的任何错误，可以使用global event handler onerror：

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

Demonstration

如果您的目标是拦截浏览器中浏览器写入的所有内容，而不仅仅是错误，我不确定它是否可以直接使用，因为浏览器不会使用无法访问console可以解决所有问题。

但你可以通过挂钩所有全局事件处理程序来做很多事情：

Demonstration

Answer 2

我认为@ dystroy的答案就足够了，但是如果你想要正确的错误处理，你应该使用try和catch语句代替..

Demo

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);
    }
}

上述代码的说明：

我们首先创建一个函数，在单击按钮时调用该函数，而当您单击该按钮时，try块中的代码将被执行，如果有任何错误，我们将抛出错误使用catch语句，其中使用throw_error.message打印错误消息，最后，我们使用setTimeout清除2000中的错误消息，即2秒

在页面上显示JavaScript控制台错误

2 个答案: