ejemplos - obtener contenido de un div javascript
''consola'' es un error indefinido para Internet Explorer (21)
Estoy usando Firebug y tengo algunas afirmaciones como:
console.log("...");
en mi pagina En IE8 (probablemente también en versiones anteriores) recibo errores de script que dicen que ''consola'' no está definido. Intenté poner esto en la parte superior de mi página:
<script type="text/javascript">
if (!console) console = {log: function() {}};
</script>
Todavía me salen los errores. ¿Alguna forma de deshacerse de los errores?
Algunas veces la consola funcionará en IE8 / 9 pero fallará en otras ocasiones. Este comportamiento errático depende de si tiene herramientas de desarrollador abiertas y se describe en la pregunta de ¿IE9 es compatible con console.log y es una función real?
Basado en dos respuestas previas de
- Vinícius Moraes
- Peter Tseng
y las documentaciones para
- Internet Explorer (IE 10)
- Safari (2012. 07. 23.)
- Firefox (2013. 05. 20.)
- Chrome (2013. 01. 25.) y Chrome (2012. 10. 04.)
- y algo de mi conocimiento
Aquí hay una implementación de mejor esfuerzo para el problema, lo que significa que si existe un console.log que realmente existe, llena los vacíos de métodos no existentes a través de console.log.
Por ejemplo, para IE6 / 7 puede reemplazar el registro con alerta (estúpido pero funciona) y luego incluir el monstruo a continuación (lo llamé console.js): [Siéntase libre de eliminar los comentarios como lo considere oportuno, los dejé como referencia, un minimizador puede abordarlos]:
<!--[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>
y 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];
}
}
})();
Después de tener tantos problemas con esto (es difícil depurar el error, ya que si abres la consola de desarrolladores, ¡el error ya no ocurre!) Decidí crear un código de exceso para no tener que preocuparme nunca más por esto:
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, solo uso console.log y console.error, pero este código maneja todas las demás funciones como se muestra en la Red de desarrolladores de Mozzila: https://developer.mozilla.org/en-US/docs/Web/API/console . Simplemente coloque ese código en la parte superior de su página y habrá terminado para siempre con esto.
En IE9, si la consola no está abierta, este código:
alert(typeof console);
mostrará "objeto", pero este código
alert(typeof console.log);
lanzará la excepción TypeError, pero no devolverá un valor indefinido;
Entonces, la versión garantizada del código se verá similar a esto:
try {
if (window.console && window.console.log) {
my_console_log = window.console.log;
}
} catch (e) {
my_console_log = function() {};
}
En mis scripts, o bien uso la taquigrafía:
window.console && console.log(...) // only log if the function exists
o, si no es posible o factible editar cada línea de console.log, creo una consola falsa:
// 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 () {});
Estoy usando fauxconsole ; He modificado el css un poco para que se vea mejor pero funciona muy bien.
Notó que OP está usando Firebug con IE, así que supongamos que es Firebug Lite . Esta es una situación extraña a medida que la consola se define en IE cuando se abre la ventana del depurador, pero ¿qué sucede cuando Firebug ya se está ejecutando? No estoy seguro, pero quizás el método "firebugx.js" podría ser una buena manera de probar en esta situación:
fuente:
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() {}
}
(enlaces actualizados 12/2014)
Otra alternativa es el operador typeof
:
if (typeof console == "undefined") {
this.console = {log: function() {}};
}
Otra alternativa más es usar una biblioteca de registro, como mi propio log4javascript .
Para IE8 o soporte de consola limitado a console.log (sin depuración, seguimiento, ...) puede hacer lo siguiente:
Si console O console.log no definido: cree funciones ficticias para las funciones de la consola (rastreo, depuración, registro, ...)
window.console = { debug : function() {}, ...};
De lo contrario, si console.log está definido (IE8) Y console.debug (cualquier otro) no está definido: redirige todas las funciones de registro a console.log, ¡esto permite mantener esos registros!
window.console = { debug : window.console.log, ...};
No estoy seguro sobre el soporte de afirmación en varias versiones de IE, pero cualquier sugerencia es bienvenida. También publiqué esta respuesta aquí: ¿Cómo puedo usar el registro de la consola en Internet Explorer?
Para la depuración en IE, echa un vistazo a este log4javascript
Para una solución más robusta, use este fragmento de código (tomado del código fuente de 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;
}
}
}());
Pegue lo siguiente en la parte superior de su JavaScript (antes de usar la consola):
/**
* 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;
}
})();
La envoltura de cierre de la función consiste en definir las variables para no definir ninguna variable. Esto protege contra la console
no definida y la console.debug
indefinida console.debug
(y otros métodos faltantes).
EDITAR: noté que HTML5 Boilerplate utiliza un código similar en su archivo js / plugins.js, si está buscando una solución que (probablemente) se mantendrá actualizada.
Puede usar console.log()
si tiene las Developer Tools
en IE8 abiertas y también puede usar el cuadro de texto Console
en la pestaña de script.
Puede usar console.log (...) directamente en Firefox pero no en IEs. En IEs tienes que usar window.console.
Puede usar lo siguiente para dar un grado adicional de seguro de que tiene todas las bases cubiertas. Usar typeof
primero evitará cualquier error undefined
. El uso de ===
también asegurará que el nombre del tipo sea en realidad la cadena "indefinido". Finalmente, querrá agregar un parámetro a la firma de función (elegí logMsg
arbitraria) para garantizar la coherencia, ya que pasa lo que quiera que se imprima a la consola a la función de registro. Esto también lo mantiene inteligente y evita advertencias / errores en su IDE de JS.
if(!window.console || typeof console === "undefined") {
var console = { log: function (logMsg) { } };
}
Sólo estoy usando console.log en mi código. Así que incluyo un 2 liner muy corto.
var console = console || {};
console.log = console.log || function(){};
Se encontró un problema similar al ejecutar console.log en ventanas secundarias en IE9, creado por la función window.open.
Parece que, en este caso, la consola está definida solo en la ventana principal y no está definida en las ventanas secundarias hasta que las actualice. Lo mismo se aplica a los niños de ventanas de niños.
Me ocupo de este problema envolviendo el registro en la siguiente función (a continuación se muestra un fragmento del módulo)
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);
}
Tratar
if (!window.console) console = ...
Una variable no definida no puede ser referida directamente. Sin embargo, todas las variables globales son atributos del mismo nombre del contexto global ( window
en el caso de los navegadores), y acceder a un atributo no definido está bien.
O use if (typeof console === ''undefined'') console = ...
si desea evitar la window
variable mágica, vea la respuesta de @Tim Down .
Trozo de consola en 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: () => { },
}
};
console = console || {
debug: function(){},
log: function(){}
...
}
if (typeof console == "undefined") {
this.console = {
log: function() {},
info: function() {},
error: function() {},
warn: function() {}
};
}