2009-08-20 29 views
63

¿Cómo podemos depurar JavaScript con IE 8?Cómo depurar Javascript con IE 8

La JavaScript debbuging con Visual Studio no funciona después de una actualización de IE 8.

+1

Gracias por la ayuda, aunque lo ideal que habría sido una respuesta a una de las preguntas que usted ha mencionado en el post. ¡La 'Pregunta de preguntar' en Stackoverflow es solo para hacer preguntas! –

+1

Es genial que quieras ayudar. Pero la forma en que haces esto es 'Haz una pregunta', y luego publícala como una _respuesta a la pregunta que hiciste_. –

+0

¿Es mejor así? –

Respuesta

81

descubrí hoy que ahora podemos depurar Javascript Con los plugins de barra de herramientas de desarrollo integreted en IE 8.

  • Haga clic en ▼ Herramientas en la barra de herramientas, a la derecha de las pestañas.
  • Seleccione Herramientas de desarrollador. El diálogo Herramientas de desarrollador debería abrirse.
  • Haga clic en la ficha Script en el cuadro de diálogo.
  • Haga clic en el botón Iniciar la depuración.

Puede usar el reloj, el punto de interrupción, ver la pila de llamadas, etc., de manera similar a los depuradores en los navegadores profesionales.

También puede usar la instrucción debugger; en su código JavaScript para establecer un punto de interrupción.

+2

Puede establecer puntos de interrupción sin el depurador; declaración. IE8 es muy bueno para la depuración de JS, ESPECIALMENTE ya que puedes renderizar y analizar como IE7, con herramientas de IE8. –

+1

La instrucción 'depurador' no parece funcionar para mí. – slikts

+2

@Reinis I. ¿Pusiste una; después de tu depurador; ?? –

6

Esto no lo ayudará a pasar por el código o romper los errores, pero es una forma útil de obtener la misma consola de depuración para su proyecto en todos los navegadores.

myLog = function() { 
    if (!myLog._div) { myLog.createDiv(); } 

    var logEntry = document.createElement('span'); 
    for (var i=0; i < arguments.length; i++) { 
     logEntry.innerHTML += myLog.toJson(arguments[i]) + '<br />'; 
    } 
    logEntry.innerHTML += '<br />'; 

    myLog._div.appendChild(logEntry); 
} 
myLog.createDiv = function() { 
    myLog._div = document.body.appendChild(document.createElement('div')); 
    var props = { 
     position:'absolute', top:'10px', right:'10px', background:'#333', border:'5px solid #333', 
     color: 'white', width: '400px', height: '300px', overflow: 'auto', fontFamily: 'courier new', 
     fontSize: '11px', whiteSpace: 'nowrap' 
    } 
    for (var key in props) { myLog._div.style[key] = props[key]; } 
} 
myLog.toJSON = function(obj) { 
    if (typeof window.uneval == 'function') { return uneval(obj); } 
    if (typeof obj == 'object') { 
     if (!obj) { return 'null'; } 
     var list = []; 
     if (obj instanceof Array) { 
      for (var i=0;i < obj.length;i++) { list.push(this.toJson(obj[i])); } 
      return '[' + list.join(',') + ']'; 
     } else { 
      for (var prop in obj) { list.push('"' + prop + '":' + this.toJson(obj[prop])); } 
      return '{' + list.join(',') + '}'; 
     } 
    } else if (typeof obj == 'string') { 
     return '"' + obj.replace(/(["'])/g, '\\$1') + '"'; 
    } else { 
     return new String(obj); 
    } 
} 

myLog('log statement'); 
myLog('logging an object', { name: 'Marcus', likes: 'js' }); 

Esto se armó bastante apresurada y es un poco descuidado, pero es útil, sin embargo, y se puede mejorar fácilmente!

3

Tenía la esperanza de agregar esto como un comentario a la respuesta de Marcus Westin, pero no puedo encontrar un enlace, tal vez necesito más reputación?


De todos modos, gracias, encontré este fragmento de código útil para la depuración rápida en IE. He hecho algunas modificaciones rápidas para solucionar un problema que dejó de funcionar para mí, también para desplazarme hacia abajo automáticamente y usar un posicionamiento fijo para que aparezca en la ventana gráfica. Aquí está mi versión en caso de que alguien le resulta útil:

myLog = function() { 

    var _div = null; 

    this.toJson = function(obj) { 

     if (typeof window.uneval == 'function') { return uneval(obj); } 
     if (typeof obj == 'object') { 
      if (!obj) { return 'null'; } 
      var list = []; 
      if (obj instanceof Array) { 
        for (var i=0;i < obj.length;i++) { list.push(this.toJson(obj[i])); } 
        return '[' + list.join(',') + ']'; 
      } else { 
        for (var prop in obj) { list.push('"' + prop + '":' + this.toJson(obj[prop])); } 
        return '{' + list.join(',') + '}'; 
      } 
     } else if (typeof obj == 'string') { 
      return '"' + obj.replace(/(["'])/g, '\\$1') + '"'; 
     } else { 
      return new String(obj); 
     } 

    }; 

    this.createDiv = function() { 

     myLog._div = document.body.appendChild(document.createElement('div')); 

     var props = { 
      position:'fixed', top:'10px', right:'10px', background:'#333', border:'5px solid #333', 
      color: 'white', width: '400px', height: '300px', overflow: 'auto', fontFamily: 'courier new', 
      fontSize: '11px', whiteSpace: 'nowrap' 
     } 

     for (var key in props) { myLog._div.style[key] = props[key]; } 

    }; 


    if (!myLog._div) { this.createDiv(); } 

    var logEntry = document.createElement('span'); 

    for (var i=0; i < arguments.length; i++) { 
     logEntry.innerHTML += this.toJson(arguments[i]) + '<br />'; 
    } 

    logEntry.innerHTML += '<br />'; 

    myLog._div.appendChild(logEntry); 

    // Scroll automatically to the bottom 
    myLog._div.scrollTop = myLog._div.scrollHeight; 

} 
+0

No lo entiendo¿Cómo puedo usar esto en IE8 para depurar javascript, por favor? Ejecutar javascript para depurar javascript? – Fandango68

+1

@ Fernando68 Es JavaScript para agregar una consola de depuración que puede ver en la página, que mostrará las cosas que registra con 'myLog ('quiero ver esto', fooObject);'. Creo que realmente no debería necesitarlo con IE8 porque mientras tenga las herramientas de desarrollador abiertas, puede usar console.log, depuración paso a paso, etc. Pero si tiene que depurar navegadores aún más antiguos, quizás ayuda. Afortunadamente, ¡no he tenido que usar esto durante mucho tiempo! – poshaughnessy