web-dev-qa-db-fra.com

Comment suspendre l'exécution du script dans la console des développeurs

J'essaie de créer une bannière rotative (JavaScript et CSS). Pour déboguer et apporter des modifications sur le CSS, etc. dans la console des développeurs, je souhaite suspendre l'exécution de JavaScript pendant que j'apporte des modifications, puis l'exécuter, etc. Alors, existe-t-il un moyen de suspendre l'exécution du script dans le navigateur?

javascriptdebuggingconsole
24
ptamzz

Vous recherchez des "points d'arrêt".

Quel navigateur utilisez-vous?

Chrome prend immédiatement en charge les points d'arrêt dans ses outils de développement:
F12 (ou Ctrl-Shift-I), onglet "Script", sélectionnez le script dans la liste déroulante, cliquez sur le numéro de ligne.
Mettre à jour:
Sur PC: F12 ou Ctrl+Shift+I/Sur Mac: Cmd+Alt+I
sélectionnez l'onglet "Sources", sélectionnez le script dans le volet de fichiers à gauche, cliquez sur le numéro de ligne.

Dans Firefox, utilisez l'extension Firebug:
Sur PC et Mac: F12,
Onglet "Script", activez et rechargez si nécessaire, sélectionnez le script dans la liste déroulante, cliquez sur le numéro de ligne.

Lorsque votre Javascript s'arrête à un point d'arrêt, les deux navigateurs vous offrent les outils de débogage habituels pour parcourir le code, inspecter et modifier les valeurs des variables, surveiller les expressions, ...

22
Jpsy

Comme katspaugh mentionne dans leur commentaire :

F8

Cela ne fonctionne que pour moi à partir de l'onglet Sources de la fenêtre Outils de développement dans Chrome 59.0.3071.115 (sur Mac OS X).

14
Kenny Evitt

Vous pouvez écrire vous-même un code de pause. Suspendez l'exécution javascript à l'aide du débogueur. Dans la console chrome, exécutez:

window.addEventListener('keydown', function(event) { 
  if (event.defaultPrevented) {
    return; // Should do nothing if the default action has been cancelled
  }
  let handled = false;
  if (event.keyCode == 123) {
    handled = true;
    debugger;  // 123 is the keyCode of F12
  }
  if (handled) {
    // Suppress "double action" if event handled
    event.preventDefault();
  }
});

Mettre en surbrillance l'élément avec l'inspecteur

Appuyez sur F12

1
Zihao Zhao