“控制台”是 Internet Explorer 的未定义错误

IT技术 javascript internet-explorer internet-explorer-8 ie-developer-tools
2021-01-23 21:37:14

我正在使用 Firebug 并有一些声明,例如:

console.log("...");

在我的页面。在 IE8(也可能是早期版本)中,我收到脚本错误,提示“控制台”未定义。我试着把它放在我的页面顶部:

<script type="text/javascript">
    if (!console) console = {log: function() {}};
</script>

我仍然收到错误。有什么办法可以摆脱错误?

6个回答

尝试

if (!window.console) console = ...

无法直接引用未定义的变量。但是,所有全局变量都是全局上下文的同名属性(window在浏览器的情况下),访问未定义的属性是可以的。

或者,if (typeof console === 'undefined') console = ...如果您想避免使用魔法变量window,请参阅@Tim Down 的回答

只是为了让其他使用它的人清楚,放置<script type="text/javascript"> if (!window.console) console = {log: function() {}}; </script>在您的页面顶部!谢谢肯尼。
2021-03-15 21:37:14
关于什么 var console = console || { log: function() {} };
2021-03-17 21:37:14
该答案的问题是,如果您使用其他名称,如调试、警告、计数,缺少控制台的浏览器将引发异常,请参阅执行该操作的更好方法stackoverflow.com/a/16916941/2274855
2021-03-29 21:37:14
该死的......你建立了一个不错的网站,为你最喜欢的浏览器开发它。最后,您花费 4-5 小时使其与所有其他现代浏览器兼容,然后您花费 4-5 天使其与 IE 兼容。
2021-03-31 21:37:14
@lorddev 要使用该速记,您需要包括windowvar console = window.console || { log: function() {} };
2021-04-05 21:37:14

将以下内容粘贴到 JavaScript 的顶部(在使用控制台之前):

/**
 * Protect window.console method calls, e.g. console is not defined on IE
 * unless dev tools are open, and IE doesn't define console.debug
 * 
 * Chrome 41.0.2272.118: debug,error,info,log,warn,dir,dirxml,table,trace,assert,count,markTimeline,profile,profileEnd,time,timeEnd,timeStamp,timeline,timelineEnd,group,groupCollapsed,groupEnd,clear
 * Firefox 37.0.1: log,info,warn,error,exception,debug,table,trace,dir,group,groupCollapsed,groupEnd,time,timeEnd,profile,profileEnd,assert,count
 * Internet Explorer 11: select,log,info,warn,error,debug,assert,time,timeEnd,timeStamp,group,groupCollapsed,groupEnd,trace,clear,dir,dirxml,count,countReset,cd
 * Safari 6.2.4: debug,error,log,info,warn,clear,dir,dirxml,table,trace,assert,count,profile,profileEnd,time,timeEnd,timeStamp,group,groupCollapsed,groupEnd
 * Opera 28.0.1750.48: debug,error,info,log,warn,dir,dirxml,table,trace,assert,count,markTimeline,profile,profileEnd,time,timeEnd,timeStamp,timeline,timelineEnd,group,groupCollapsed,groupEnd,clear
 */
(function() {
  // Union of Chrome, Firefox, IE, Opera, and Safari console methods
  var methods = ["assert", "cd", "clear", "count", "countReset",
    "debug", "dir", "dirxml", "error", "exception", "group", "groupCollapsed",
    "groupEnd", "info", "log", "markTimeline", "profile", "profileEnd",
    "select", "table", "time", "timeEnd", "timeStamp", "timeline",
    "timelineEnd", "trace", "warn"];
  var length = methods.length;
  var console = (window.console = window.console || {});
  var method;
  var noop = function() {};
  while (length--) {
    method = methods[length];
    // define undefined methods as noops to prevent errors
    if (!console[method])
      console[method] = noop;
  }
})();

函数闭包包装器将变量范围限定为不定义任何变量。这可以防止未定义console和未定义console.debug(以及其他丢失的方法)。

编辑:我注意到HTML5 Boilerplate在其 js/plugins.js 文件中使用了类似的代码,如果您正在寻找(可能)保持最新的解决方案。

我认为无论哪种方式 - (function(){...}()) 或 (function(){...})() - 实际上都有效
2021-03-13 21:37:14
相当完整,只是它不会尝试将日志记录重定向到日志功能(如果存在),因此所有日志都会丢失
2021-03-26 21:37:14
为什么这个答案的赞成票这么少?它是这里发布的最完整的之一。
2021-03-29 21:37:14
因为约会。绝对同意正确的工作解决方案。我认为这个话题需要缓和。抱歉英语不好。
2021-04-02 21:37:14
这究竟会在什么时候发生?此代码应仅定义尚未定义的元素。
2021-04-07 21:37:14

另一种选择是typeof运算符:

if (typeof console == "undefined") {
    this.console = {log: function() {}};
}

另一种选择是使用日志库,例如我自己的log4javascript

@yckart:不typeof,保证返回一个字符串并且"undefined"是一个字符串。当两个操作数的类型相同,==并且===被指定执行完全相同的步骤时。使用typeof x == "undefined"是一种可靠的方法来测试x在任何范围和任何 ECMAScript 3 兼容环境中是否未定义。
2021-03-13 21:37:14
使用var. 为什么会在这里混淆?
2021-03-14 21:37:14
不过,将未声明的赋值更改为正确的声明是个好主意。
2021-03-19 21:37:14
你的意思是使用var那只会混淆这里的事情。或者你的意思是分配给window.console而不是console
2021-03-20 21:37:14
多么令人困惑的讨论。+1 到原始答案。如果我能给+2,我会提供一个链接到你自己的log4javascript。谢谢欧!
2021-03-31 21:37:14

要获得更强大的解决方案,请使用这段代码(取自 twitter 的源代码):

// Avoid `console` errors in browsers that lack a console.
(function() {
    var method;
    var noop = function () {};
    var methods = [
        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
        'timeStamp', 'trace', 'warn'
    ];
    var length = methods.length;
    var console = (window.console = window.console || {});

    while (length--) {
        method = methods[length];

        // Only stub undefined methods.
        if (!console[method]) {
            console[method] = noop;
        }
    }
}());

在我的脚本中,我要么使用简写:

window.console && console.log(...) // only log if the function exists

或者,如果编辑每个 console.log 行不可能或不可行,我会创建一个假控制台:

// check to see if console exists. If not, create an empty object for it,
// then create and empty logging function which does nothing. 
//
// REMEMBER: put this before any other console.log calls
!window.console && (window.console = {} && window.console.log = function () {});
语法错误。为什么不只是if(!console) {console = {} ; console.log = function(){};}
2021-03-31 21:37:14
或者不只是 !window.console && (window.console = { log: function () { } });
2021-04-06 21:37:14