‘console’ è un errore non definito per Internet Explorer

Sto usando Firebug e ho alcune affermazioni come:

console.log("..."); 

nella mia pagina In IE8 (probabilmente anche nelle versioni precedenti) ricevo errori di script che dicono che “console” non è definita. Ho provato a metterlo in cima alla mia pagina:

  if (!console) console = {log: function() {}};  

ancora ottengo gli errori. Un modo per sbarazzarsi degli errori?

Provare

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

Una variabile non definita non può essere indirizzata direttamente. Tuttavia, tutte le variabili globali sono attributi con lo stesso nome del contesto globale ( window nel caso di browser) e l’accesso a un attributo non definito va bene.

Oppure usa if (typeof console === 'undefined') console = ... se vuoi evitare la window variabili magiche, vedi la risposta di @Tim Down .

Incolla quanto segue nella parte superiore del tuo JavaScript (prima di utilizzare la console):

 /** * Protect window.console method calls, eg 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; } })(); 

La funzione wrapper di chiusura consiste nel definire le variabili in modo da non definire alcuna variabile. Questo protegge sia dalla console non definita che da console.debug (e altri metodi mancanti).

EDIT: Ho notato che HTML5 Boilerplate utilizza un codice simile nel suo file js / plugins.js, se stai cercando una soluzione che (probabilmente) sarà tenuta aggiornata.

Un’altra alternativa è l’operatore typeof :

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

Un’altra alternativa è usare una libreria di logging, ad esempio il mio log4javascript .

Per una soluzione più robusta, usa questo pezzo di codice (tratto dal codice sorgente di 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; } } }()); 

Nei miei script, io uso entrambi la stenografia:

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

oppure, se non è ansible o ansible modificare ogni riga di console.log, creo una falsa console:

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

Puoi utilizzare console.log() se hai aperto gli Developer Tools in IE8 e puoi anche utilizzare la casella di testo Console nella scheda script.

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

In IE9, se la console non è aperta, questo codice:

 alert(typeof console); 

mostrerà “object”, ma questo codice

 alert(typeof console.log); 

genererà l’eccezione TypeError, ma non restituirà un valore non definito;

Quindi, la versione garantita del codice sarà simile a questa:

 try { if (window.console && window.console.log) { my_console_log = window.console.log; } } catch (e) { my_console_log = function() {}; } 

Sto solo usando console.log nel mio codice. Quindi includo una 2 fodera molto corta

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

Basato su due risposte precedenti di

  • Vinícius Moraes
  • Peter Tseng

e le documentazioni per

  • Internet Explorer (IE 10)
  • Safari (2012. 07. 23.)
  • Firefox (2013. 05. 20.)
  • Chrome (2013. 01. 25.) e Chrome (2012. 10. 04.)
  • e alcune delle mie conoscenze

Ecco un’implementazione ottimale per il problema, ovvero se esiste un console.log che esiste effettivamente, riempie gli spazi per i metodi non esistenti tramite console.log.

Ad esempio per IE6 / 7 è ansible sostituire la registrazione con avviso (stupido ma funziona) e quindi includere il mostro sottostante (l’ho chiamato console.js): [Sentiti libero di rimuovere i commenti come ritieni opportuno, li ho lasciati per riferimento, un minimizzatore può affrontarli]:

   

e console.js:

  /** * Protect window.console method calls, eg 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]; } } })(); 

Notato che OP sta usando Firebug con IE, quindi supponi che sia Firebug Lite . Questa è una situazione funky quando la console viene definita in IE quando viene aperta la finestra del debugger, ma cosa succede quando Firebug è già in esecuzione? Non sono sicuro, ma forse il metodo “firebugx.js” potrebbe essere un buon modo per testare in questa situazione:

fonte:

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

(link aggiornati 12/2014)

Sto usando fauxconsole ; Ho modificato il css un po ‘in modo che appaia più bello ma funzioni molto bene.

Per il debug in IE, controlla questo log4javascript

Per IE8 o supporto console limitato a console.log (senza debug, traccia, …) è ansible effettuare le seguenti operazioni:

  • Se console o console.log non definito: creare funzioni fittizie per le funzioni della console (traccia, debug, registro, …)

    window.console = { debug : function() {}, ...};

  • Altrimenti se console.log è definito (IE8) E console.debug (qualsiasi altro) non è definito: reindirizza tutte le funzioni di registrazione a console.log, questo consente di conservare tali registri!

    window.console = { debug : window.console.log, ...};

Non sono sicuro dell’asserimento del supporto in varie versioni di IE, ma qualsiasi suggerimento è benvenuto. Ha anche postato questa risposta qui: Come posso utilizzare la registrazione della console in Internet Explorer?

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

Puoi usare il sotto per dare un ulteriore grado di assicurazione che hai coperto tutte le basi. Usando typeof prima cosa si eviteranno errori undefined . L’utilizzo di === assicurerà inoltre che il nome del tipo sia effettivamente la stringa “non definita”. Infine, ti consigliamo di aggiungere un parametro alla firma della funzione (ho scelto logMsg arbitrario) per assicurarne la coerenza, dal momento che si passa a qualsiasi cosa che si desidera stampare nella console per la funzione di registro. Ciò ti assicura anche precisione intellettuale ed evita qualsiasi avviso / errore nel tuo IDE JS.

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

A volte la console funzionerà in IE8 / 9 ma fallirà in altre occasioni. Questo comportamento erratico dipende dal fatto che gli strumenti di sviluppo siano aperti ed è descritto nella domanda StackOverflow IE9 supporta console.log ed è una funzione reale?

Si è verificato un problema simile nell’esecuzione di console.log in Windows figlio in IE9, creato dalla funzione window.open.

Sembra che in questo caso la console sia definita solo nella finestra principale e non sia definita in windows secondarie finché non le aggiorni. Lo stesso vale per i bambini di Windows figlio.

Mi occupo di questo problema eseguendo il wrapping del log nella prossima funzione (sotto c’è il frammento del modulo)

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

Stub di console in TypeScript:

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

Dopo aver avuto così tanti problemi con questa cosa (è difficile eseguire il debug dell’errore poiché se apri la console degli sviluppatori l’errore non si verifica più!) Ho deciso di creare un codice di overkill per non doverlo mai più preoccupare di questo:

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

Personalmente utilizzo sempre console.log e console.error, ma questo codice gestisce tutte le altre funzioni come mostrato nella Mozzila Developer Network: https://developer.mozilla.org/en-US/docs/Web/API/console . Basta mettere quel codice nella parte superiore della pagina e hai finito per sempre con questo.

Puoi usare console.log (…) direttamente in Firefox ma non in IE. In IE devi usare window.console.