Captura del código JavaScript específico que se está ejecutando enHaga clic

Question

Estoy trabajando en un sitio que tiene un montón de JavaScript heredado y jquery incluye y no hay documentación para mostrar lo que está sucediendo cuando.

Tengo un problema específico que corregir y no puedo encontrar el código relevante que se está ejecutando cuando se hace clic en un botón. Para evitar que rastree (y tenga sentido) cientos de líneas de script heredado, ¿hay alguna característica, posiblemente en Firebug, que identifique qué script se está ejecutando cuando hago clic en un botón?

Gracias por su ayuda.

Answer 1

Creo que hay una característica en la ventana de la consola de Firebug llamada Profile. Haga clic en el perfil, haga clic en el botón y luego en el perfil nuevamente. Debería darte lo que todas las funciones fueron llamadas en ese momento. Tenga en cuenta que si este código incluye jQuery, es posible que obtenga una gran lista larga de funciones porque jQuery usa toneladas en su código. Lamentablemente, el generador de perfiles también mostrará funciones anónimas, lo que realmente puede ser un problema.

De lo contrario, haga una búsqueda en el código de la clase o ID del botón y examínelos. Si tiene una identificación de fancy, entonces puede hacer una búsqueda de #fancy en su código e intentar encontrarla. Eso puede llevarlo en una dirección general , al menos.

Answer 2

En Firebug puedes establecer un punto de interrupción en algunos JS y luego obtienes un stack que te permitirá conocer la pila de llamadas a la función actual. Entonces, si configura el punto de interrupción en función utilizada por varios manejadores, puede usar esto para descubrir exactamente en qué manejador se encuentra.

Esto probablemente no funcionará si está tratando con devoluciones de llamada AJAX y similares.

Answer 3

Puede hacer clic en el botón "Interrumpir al siguiente" de Firebug (en la pestaña Script, se ve como un botón de pausa), luego presione el botón que desea depurar.

La próxima vez que se ejecute cualquier código de JavaScript, Firebug irrumpirá en el depurador y le mostrará esa línea de código.

Answer 4

El botón de interrupción no funcionó para mí. En cambio, edité el atributo onclick con FireBug y lo antepuse con "depurador"; ... luego se romperá allí mismo una vez que haga clic :)

Answer 5

Ninguna de las respuestas anteriores funcionó para mí. Intento utilizar Firebug para descubrir cómo funciona una característica en una página para un sitio sobre el que no tengo control. Esto es lo que funcionó para mí.

En primer lugar, tiene el id del elemento estoy al hacer clic en de la fuente de la página, y luego obtener una referencia temporal para que mediante la creación de un reloj (en la pestaña de la escritura):

tmp=document.getElementById("idOfElement")

Siguiente , Asigné el valor onclick actual a otra variable temporal.

oldfunc=tmp.onclick

A continuación, define una nueva función onclick. Inicialmente traté de poner debugger; como la primera cosa en la función, pero ¡esto no funciona! Así que en lugar, he creado una alerta:

tmp.onclick = function() { alert("Ok"); oldfunc() }

Ahora, tan pronto como haga clic en el botón de la alarma aparece, en ese momento me haga clic en el botón "Interrumpir en el próximo" como se describe en otro responde a esta pregunta Luego descarto la alerta e inmediatamente estoy en el depurador en el lugar correcto.

En mi caso, el botón "Interrumpir al lado" no funcionó por sí solo, porque hay muchos otros eventos, solo el desplazamiento sobre la página estaba causando el punto de interrupción, evitando que haga clic en el botón .