example - javascript ajax post
¿Es posible depurar la carga dinámica de JavaScript mediante algún depurador como WebKit, FireBug o IE8 Developer Tool? (12)
Creo que es posible que necesites dar un "nombre" al código evaluado como este:
http://blog.getfirebug.com/2009/08/11/give-your-eval-a-name-with-sourceurl/
Si lo hace, creo que es probable que el método de debugger de la "actualización 2" funcione entonces.
De mi pregunta reciente , ya he creado algunas funciones de JavaScript para la vista parcial de carga dinámica. Por lo tanto, no puedo depurar ningún JavaScript de carga dinámica. Porque todo el JavaScript cargado será evaluado por la función "eval".
Sin embargo, encontré una forma de crear nuevo JavaScript utilizando el siguiente script para crear dinámicamente script en el encabezado del documento actual. Todos los scripts cargados se mostrarán en HTML DOM (que puede usar cualquier depurador para encontrarlo).
var script = document.createElement(''script'')
script.setAttribute("type","text/javascript")
script.text = "alert(''Test!'');";
document.getElementsByTagName(''head'')[0].appendChild(script);
Por cierto, la mayoría de los depuradores (IE8 Developer Toolbar, Firebug y Google Chrome) no pueden establecer puntos de interrupción en ningún script dinámico. Debido a que el script depurable debe cargarse la primera vez que se carga la página.
¿Tiene idea para la depuración en contenido o archivo de script dinámico?
Actualización 1 - Agregar código fuente para probar
Puede usar el siguiente archivo xhtml para intentar depurar algún valor de variable.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Dynamic Loading Script Testing</title>
<script type="text/javascript">
function page_load()
{
var script = document.createElement(''script'')
script.setAttribute("id", "dynamicLoadingScript");
script.setAttribute("type","text/javascript");
script.text = "var someVariable = 0;/n" +
"someVariable = window.outerWidth;/n" +
"alert(someVariable);";
document.getElementsByTagName(''head'')[0].appendChild(script);
}
</script>
</head>
<body onload="page_load();">
</body>
</html>
Por respuesta, simplemente lo pruebo en FireBug. El resultado debe mostrarse como las imágenes a continuación.
Consulte el script "dynamicLoadingScript" que se agrega después de la carga de la página.
Pero no se encuentra en la pestaña de scripts de FireBug
Actualización 2: Crear punto de corte de depuración en la secuencia de comandos de carga dinámica
Ambas imágenes muestran insertando "depurador"; declaración en alguna línea de script puede disparar punto de interrupción en la secuencia de comandos de carga dinámica. Sin embargo, ambos depuradores no muestran ningún código en el punto de interrupción. Por lo tanto, es inútil para hacer esto.
Gracias,
El navegador tiene que analizar el Javascript cargado dinámicamente, aquí es donde se encuentra WebKit, o el depurador FireBug, por lo que está sujeto al depurador pase lo que pase, creo que esto es lo mismo para las herramientas de desarrollo en IE8.
Por lo tanto, su código está sujeto al depurador, por lo que su problema no estará en ese archivo o texto si no se produce un error.
La otra cosa es script.text = "alert(''Test!'');"; no es válido, por lo que no funcionará en todos los navegadores; lo que usted quiere es script.innerHTML = "alert(''Test!'');";
aunque su HTML interno significa código dentro de las etiquetas HTML, no el HTML dentro de las personas que más lo usan, lo usa para esto, por lo que se explica incorrectamente
EDITADO PARA LA ACTUALIZACIÓN DOS
Y en la segunda actualización con Chrome hice esto
ir a aproximadamente: en blanco Abra la consola y pase en
var script = document.createElement(''script'')
script.setAttribute("type","text/javascript")
script.innerHTML = "alert(''Test!'');debugger;";
document.getElementsByTagName(''head'')[0].appendChild(script);
luego se romperá y abrirá la pestaña del script con about: se muestra en blanco (nada que ver)
Luego, en el lado derecho, muestre la lista de llamadas, luego haga clic en la segunda (función anónima) y se mostrará.
Entonces en su archivo tendrá una (función anónima) que es el código que está ejecutando y verá el punto de quiebre allí. para que sepas tu en la correcta.
En Firebug, debería poder ver esa secuencia de comandos después de que se cargue la página y se inyecte la secuencia de comandos. Cuando lo haga, puede establecer un punto de interrupción en el lugar apropiado y se conservará cuando actualice la página.
Estoy usando Google Chrome para ese propósito.
En Chrome, en la pestaña de scripts, puede habilitar ''pause on all exceptions''
Y luego coloque en algún lugar de su línea de código try{throw ''''} catch(e){} . Chrome detendrá la ejecución cuando llegue a esta línea.
EDITAR: imagen modificada para que quede más claro de lo que estoy hablando.
Intente agregar un "depurador"; declaración en el javascript que está agregando dinámicamente. Esto debería hacer que se detenga en esa línea, independientemente de la configuración del punto de interrupción.
Para el navegador Google Chrome actual u otros navegadores modernos, puede buscar fácilmente cualquier código evaluado con la herramienta de desarrollador, como las siguientes imágenes.
- Simula un archivo de carga dinámico.
- Presione Ctrl + Shift + F en la pestaña de fuente y busque la función anterior.
Crea un punto de interrupción y ejecuta la función para probarlo.
También sería posible usar Chrome para lo mismo. Chrome tiene una función en la que puede especificar un atributo de analizador y hacer que el fragmento de JS dinámico aparezca como un archivo que luego puede examinarse y dividirse en puntos.
el atributo que debe establecerse es
//# sourceURL=dynamicScript.js
donde dynamicScript.js es el nombre del archivo que debe aparecer en el explorador de archivos de script.
Más información here
Paul Irish también lo menciona brevemente en su excelente charla sobre Tooling & The Webapp Development Stack
Una opción me gusta usar agregando una declaración console.log ('''') en mi código. Una vez que esta declaración aparece en la consola, se asocia un número de línea. Puede hacer clic en ese número para ir a la ubicación en la fuente y establecer un punto de interrupción. El inconveniente de este enfoque es que los puntos de corte no se conservan en las recargas de página y debe ejecutar el código antes de agregar un depurador.
Usando Chrome (12.0.742.112) con el código que proporcionó más una declaración de depuración como esta
script.text = "debugger;var someVariable = 0;/n" +
"someVariable = window.outerWidth;/n" +
"alert(someVariable);";
funciona para mi.
Necesito modificar algunos JavaScript (limitando el alcance de todos los selectores de jQuery a la vista parcial actual> div) antes de ejecutarlo.
Puede ser más tangible si vincula el cambio de selector a un evento en su vista parcial en lugar de crear elementos de script en el cuerpo html (no se siente bien).
Podrías hacer algo como esto
(function(j)(
var limiting_selector = '''';
j(".partial_views").bind(''focusin over'',function(e){
limiting_selector = j(this).attr(''someattr'') // or j(this).data(''limiting-selector'')
}).bind(''focusout out'',function(e){
limiting_selector = '''';
});
// And then go on with
// j(limiting_selector+'' .someclass'')
))(jQuery)
Este código siempre agregará un selector de limitación a todas las operaciones de selección de jQuery realizadas mientras el mouse está en un elemento determinado, dado que el HTML no debe estropearse.
(Todavía parece hacker, puede ser que alguien tenga una mejor solución)
aclamaciones
Utilizando Google Chrome (o Safari ) Developers Tool, puede ejecutar JavaScript línea por línea.
Herramienta de desarrollador > Scripts > Elija qué secuencia de comandos desea depurar > señal de pausa en el lado derecho O establezca puntos de interrupción haciendo clic en el número de línea
Sí, es (ahora) posible depurar JavaScript cargado dinámicamente utilizando Google Chrome.
No es necesario agregar un debugger; adicional debugger; o cualquier otro atributo para el archivo JS cargado dinámicamente. Simplemente siga los pasos a continuación para depurar:
Método 1:
Mi líder tecnológico solo mostró una manera súper fácil de depurar métodos Javascript cargados dinámicamente.
- Abra la consola de Chrome y escriba el nombre del método y presione enter.
En mi caso, esGetAdvancedSearchConditonRowNew
Si el método JS se ha cargado, mostrará la definición del método.
- Haga clic en la definición del método y todo el archivo JS se abrirá para la depuración :)
Método 2:
Como ejemplo, estoy cargando el archivo JS cuando hago clic en un botón usando una llamada ajax .
- Abrir
networkpestaña denetworken las herramientas de desarrollo google chrome - Haga clic en un control (por ejemplo, botón) que carga un poco de archivo javascript y llama a alguna función de JavaScript.
- observe la pestaña de red y busque esa función JS (en mi caso es
RetrieveAllTags?_=1451974716935) - Desplácese sobre su
initiatery encontrará su archivo JS cargado dinámicamente (con el prefijoVM*).
- Haga clic en ese archivo
VM*para abrir. - Pon el depurador donde quieras en ese archivo: D
