El uso de Google Chrome para depurar y editar JavaScript incrustado en la página HTML

Question

herramientas para desarrolladores de Chrome

le permite editar JavaScript en el navegador si el JavaScript está en un archivo .js. Sin embargo, no parece que me permita editar javascript que está incrustado en una página HTML. es decir:

<script type="text/javascript> 
// code here that I want to debug/edit 
</script> 

Este es un gran problema para mí, ya que tengo un poco de javascript incrustado en una página determinada.

similares a esta pregunta: Edit JavaScript blocks of web page... live pero esto se trata de Firefox, no cromo.

¿Cómo puedo editar JavaScript incrustado en una página HTML usando Google Chrome Developer Tools?

Answer 1

En realidad Chrome permite hacer eso, elija archivos HTML en pestaña Fuentes en la ventana Herramientas del desarrollador. Verá HTML en lugar de javascript y simplemente agregará puntos de interrupción en las etiquetas <script>. También puede agregar el comando debugger; para ejecutar el script de lo que desea depurar. Por ejemplo:

<script> 
// some code 
debugger; // This is your breakpoint 
// other code you will able to debugg 
</script> 

No se olvide de quitar debugger; 's cuando se quiere liberar su sitio web.

Answer 2

Ir a la ficha Elementos, encontrar la secuencia de comandos, haga clic derecho en la parte que necesita y elegir la opción "Editar como HTML".

Si ya no aparece Edición de HTML, haga doble clic en el nodo y debe convertirse resaltados y editable.

Answer 3

que tenían dificultades para localizar el archivo que tenía mi línea/javascript incrustado. Para otros que tienen el mismo problema, esto puede o no ser útil ...

Usando Chrome 21.0.1180.89 m para Windows

Todos los archivos se muestran tras pulsar ese mismo discretamente colocado botón. Ver:

Ahora usted puede comenzar la depuración ...

Answer 4

Ninguna de estas respuestas han trabajado para mí.

Lo que funciona para mí es que si tengo mi javascript en la página ya cargada, puedo copiar ese javascript, editarlo, pegarlo en la consola y redefinirá cualquier función o lo que sea que deba redefinir.

por ejemplo, si la página tiene:

<script> 
var foo = function() { console.log("Hi"); } 
</script> 

puedo tomar el contenido entre el guión, editarlo, y luego introducirlo en el depurador como:

foo = function() { console.log("DO SOMETHING DIFFERENT"); } 

y funcionará para mi.

O si lo tienes como,

function foo() { 
    doAThing(); 
} 

Puede escribir simplemente

function foo() { 
    doSomethingElse(); 
} 

y foo se redefinirán.

Probablemente no sea la mejor solución, pero funciona.