& # 39;控制台# 39;是Internet Explorer的未定义错误

我使用Firebug,并有一些语句像:

console.log("...");

在我的页面上。在IE8(可能是更早的版本),我得到脚本错误说“控制台”是未定义的。我试着把这个放在我页面的顶部:

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

我还是会得到错误。有办法消除错误吗?

257749 次浏览

试一试

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

未定义的变量不能直接引用。然而,所有全局变量都是全局上下文同名的属性(浏览器为window),访问未定义的属性是可以的。

或者使用if (typeof console === 'undefined') console = ...,如果你想避免神奇的变量window,见蒂姆·唐恩的回答

在我的脚本中,我要么使用速记:

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

另一个替代方法是typeof操作符:

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

还有一种替代方法是使用日志库,比如我自己的log4javascript

您可以在Firefox中直接使用console.log(…),但不能在ie中使用。在ie中,你必须使用window.console。

如果你在IE8中打开了Developer Tools,你可以使用console.log(),也可以使用脚本选项卡上的Console文本框。

我使用fauxconsole;我修改了css一点,使它看起来更好,但工作得很好。

在IE9中,如果控制台未打开,以下代码:

alert(typeof console);

会显示“对象”,但这个代码

alert(typeof console.log);

将抛出TypeError异常,但不返回未定义的值;

因此,保证版本的代码将类似于:

try {
if (window.console && window.console.log) {
my_console_log = window.console.log;
}
} catch (e) {
my_console_log = function() {};
}
if (typeof console == "undefined") {
this.console = {
log: function() {},
info: function() {},
error: function() {},
warn: function() {}
};
}

在使用控制台之前,将以下内容粘贴到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;
}
})();

函数闭包包装器的作用域是不定义任何变量。这可以防止undefined console和undefined console.debug(以及其他缺失的方法)。

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

你可以使用下面的方法来给你一个额外的保险程度,你已经覆盖了所有的基础。首先使用typeof将避免任何undefined错误。使用===还将确保类型的名称实际上是字符串“undefined”。最后,你需要给函数签名添加一个参数(我随意选择了logMsg)以确保一致性,因为你要把你想打印到控制台的任何东西传递给日志函数。这也能让你的智能感知保持准确,避免在JS感知的IDE中出现任何警告/错误。

if(!window.console || typeof console === "undefined") {
var console = { log: function (logMsg) { } };
}

要在IE中调试,请查看log4javascript

对于IE8或控制台支持仅限于console.log(没有调试,跟踪,…),您可以执行以下操作:

  • 如果console OR console.log undefined:为 控制台函数(跟踪,调试,日志,…)

    < p > <代码>窗口。控制台= { 调试:function(){},…};

  • .
  • 否则如果console.log被定义(IE8)和console.debug(任何其他)没有定义:重定向所有日志功能到console.log,这允许保留这些日志!

    < p > <代码>窗口。控制台= { 调试:window.console.log,…};

  • .log,

不确定在各种IE版本中的assert支持,但欢迎任何建议。还在这里发布了这个答案:如何在Internet Explorer中使用控制台登录?

为了更健壮的解决方案,使用下面的代码(取自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;
}
}
}());

根据之前的两个答案

和文件

下面是针对该问题的最佳实现,这意味着如果有一个真正存在的console.log,它将通过console.log填补不存在方法的空白。

例如,对于IE6/7,你可以用alert代替日志记录(愚蠢但有效),然后包括下面的怪物(我称之为console.js): [请随意删除你认为合适的评论,我把它们留作参考,最小化可以解决它们]:

<!--[if lte IE 7]>
<SCRIPT LANGUAGE="javascript">
(window.console = window.console || {}).log = function() { return window.alert.apply(window, arguments); };
</SCRIPT>
<![endif]-->
<script type="text/javascript" src="console.js"></script>

和console.js:

    /**
* 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
*/
(function() {
var console = (window.console = window.console || {});
var noop = function () {};
var log = console.log || noop;
var start = function(name) { return function(param) { log("Start " + name + ": " + param); } };
var end = function(name) { return function(param) { log("End " + name + ": " + param); } };


var methods = {
// Internet Explorer (IE 10): http://msdn.microsoft.com/en-us/library/ie/hh772169(v=vs.85).aspx#methods
// assert(test, message, optionalParams), clear(), count(countTitle), debug(message, optionalParams), dir(value, optionalParams), dirxml(value), error(message, optionalParams), group(groupTitle), groupCollapsed(groupTitle), groupEnd([groupTitle]), info(message, optionalParams), log(message, optionalParams), msIsIndependentlyComposed(oElementNode), profile(reportName), profileEnd(), time(timerName), timeEnd(timerName), trace(), warn(message, optionalParams)
// "assert", "clear", "count", "debug", "dir", "dirxml", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "msIsIndependentlyComposed", "profile", "profileEnd", "time", "timeEnd", "trace", "warn"


// Safari (2012. 07. 23.): https://developer.apple.com/library/safari/#documentation/AppleApplications/Conceptual/Safari_Developer_Guide/DebuggingYourWebsite/DebuggingYourWebsite.html#//apple_ref/doc/uid/TP40007874-CH8-SW20
// assert(expression, message-object), count([title]), debug([message-object]), dir(object), dirxml(node), error(message-object), group(message-object), groupEnd(), info(message-object), log(message-object), profile([title]), profileEnd([title]), time(name), markTimeline("string"), trace(), warn(message-object)
// "assert", "count", "debug", "dir", "dirxml", "error", "group", "groupEnd", "info", "log", "profile", "profileEnd", "time", "markTimeline", "trace", "warn"


// Firefox (2013. 05. 20.): https://developer.mozilla.org/en-US/docs/Web/API/console
// debug(obj1 [, obj2, ..., objN]), debug(msg [, subst1, ..., substN]), dir(object), error(obj1 [, obj2, ..., objN]), error(msg [, subst1, ..., substN]), group(), groupCollapsed(), groupEnd(), info(obj1 [, obj2, ..., objN]), info(msg [, subst1, ..., substN]), log(obj1 [, obj2, ..., objN]), log(msg [, subst1, ..., substN]), time(timerName), timeEnd(timerName), trace(), warn(obj1 [, obj2, ..., objN]), warn(msg [, subst1, ..., substN])
// "debug", "dir", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "time", "timeEnd", "trace", "warn"


// Chrome (2013. 01. 25.): https://developers.google.com/chrome-developer-tools/docs/console-api
// assert(expression, object), clear(), count(label), debug(object [, object, ...]), dir(object), dirxml(object), error(object [, object, ...]), group(object[, object, ...]), groupCollapsed(object[, object, ...]), groupEnd(), info(object [, object, ...]), log(object [, object, ...]), profile([label]), profileEnd(), time(label), timeEnd(label), timeStamp([label]), trace(), warn(object [, object, ...])
// "assert", "clear", "count", "debug", "dir", "dirxml", "error", "group", "groupCollapsed", "groupEnd", "info", "log", "profile", "profileEnd", "time", "timeEnd", "timeStamp", "trace", "warn"
// Chrome (2012. 10. 04.): https://developers.google.com/web-toolkit/speedtracer/logging-api
// markTimeline(String)
// "markTimeline"


assert: noop, clear: noop, trace: noop, count: noop, timeStamp: noop, msIsIndependentlyComposed: noop,
debug: log, info: log, log: log, warn: log, error: log,
dir: log, dirxml: log, markTimeline: log,
group: start('group'), groupCollapsed: start('groupCollapsed'), groupEnd: end('group'),
profile: start('profile'), profileEnd: end('profile'),
time: start('time'), timeEnd: end('time')
};


for (var method in methods) {
if ( methods.hasOwnProperty(method) && !(method in console) ) { // define undefined methods as best-effort methods
console[method] = methods[method];
}
}
})();

在有这么多问题之后(很难调试错误,因为如果你打开开发人员控制台,错误就不再发生了!)我决定做一个多余的代码,这样就再也不用为这个问题烦恼了:

if (typeof window.console === "undefined")
window.console = {};


if (typeof window.console.debug === "undefined")
window.console.debug= function() {};


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


if (typeof window.console.error === "undefined")
window.console.error= function() {alert("error");};


if (typeof window.console.time === "undefined")
window.console.time= function() {};


if (typeof window.console.trace === "undefined")
window.console.trace= function() {};


if (typeof window.console.info === "undefined")
window.console.info= function() {};


if (typeof window.console.timeEnd === "undefined")
window.console.timeEnd= function() {};


if (typeof window.console.group === "undefined")
window.console.group= function() {};


if (typeof window.console.groupEnd === "undefined")
window.console.groupEnd= function() {};


if (typeof window.console.groupCollapsed === "undefined")
window.console.groupCollapsed= function() {};


if (typeof window.console.dir === "undefined")
window.console.dir= function() {};


if (typeof window.console.warn === "undefined")
window.console.warn= function() {};
我个人只使用console.log和console.log。错误,但这段代码处理所有其他函数显示在Mozzila开发者网络:https://developer.mozilla.org/en-US/docs/Web/API/console。 只要把代码放在你的页面顶部,你就永远不用这样做了

我只使用console.log在我的代码。所以我包括一个很短的2眼线

var console = console || {};
console.log = console.log || function(){};
console = console || {
debug: function(){},
log: function(){}
...
}

有时控制台可以在IE8/9中工作,但在其他时候会失败。这种不稳定的行为取决于你是否打开了开发工具,并在stackoverflow问题IE9是否支持console.log,它是一个真实的功能吗?中描述

注意OP在IE中使用Firebug,所以假设它是Firebug Lite。当调试器窗口打开时,在IE中定义控制台,这是一种奇怪的情况,但是当Firebug已经在运行时会发生什么呢?不确定,但在这种情况下,"firebugx.js"方法可能是一个很好的测试方法:

来源:

https://code.google.com/p/fbug/source/browse/branches/firebug1.2/lite/firebugx.js?r=187

    if (!window.console || !console.firebug) {
var names = [
"log", "debug", "info", "warn", "error", "assert",
"dir","dirxml","group","groupEnd","time","timeEnd",
"count","trace","profile","profileEnd"
];
window.console = {};
for (var i = 0; i < names.length; ++i)
window.console[names[i]] = function() {}
}

(更新链接12/2014)

在IE9的子窗口中运行console.log时遇到类似问题,由window创建。打开功能。

在这种情况下,控制台似乎只在父窗口中定义,在刷新子窗口之前没有定义。同样适用于子窗口的子窗口。

我处理这个问题通过包装log在下一个函数(下面是模块的片段)

getConsole: function()
{
if (typeof console !== 'undefined') return console;


var searchDepthMax = 5,
searchDepth = 0,
context = window.opener;


while (!!context && searchDepth < searchDepthMax)
{
if (typeof context.console !== 'undefined') return context.console;


context = context.opener;
searchDepth++;
}


return null;
},
log: function(message){
var _console = this.getConsole();
if (!!_console) _console.log(message);
}

在TypeScript中控制台的存根:

if (!window.console) {
console = {
assert: () => undefined,
clear: () => undefined,
count: () => undefined,
debug: () => undefined,
dir: () => undefined,
dirxml: () => undefined,
error: () => undefined,
group: () => undefined,
groupCollapsed: () => undefined,
groupEnd: () => undefined,
info: () => undefined,
log: () => undefined,
msIsIndependentlyComposed: (e: Element) => false,
profile: () => undefined,
profileEnd: () => undefined,
select: () => undefined,
time: () => undefined,
timeEnd: () => undefined,
trace: () => undefined,
warn: () => undefined,
}
};