Certains étudiants diront que vous pouvez utiliser la recherche de code source. En effet, pour une page relativement simple, cette approche fonctionne souvent. Cependant, pour les pages avec une composition relativement complexe (par exemple, la page intègre de nombreux fichiers et fragments de script, utilise une grande section d'implémentation orientée objet et cache le code d'implémentation), cela peut ne pas être aussi simple à trouver.
Dans le débogage Javascript, nous utilisons souvent le débogage par point d'arrêt. En fait, lors du débogage de la structure DOM, nous pouvons également utiliser la méthode du point d'arrêt, qui est DOM Breakpoint.
Utilisation spécifique :
1. Dans le navigateur Chrome, ouvrez les outils de développement, sélectionnez d'abord un élément de page, puis cliquez avec le bouton droit de la souris, cliquez sur "Pause sur..." dans le menu - et cochez "Modifications d'attributs". Actualisez la page Lorsque l'attribut de l'élément change, l'exécution du script sera suspendue et l'emplacement du changement sera localisé.
2. Dans le navigateur Firefox avec Firebug installé, ouvrez Firebug, passez à l'onglet "HTML", sélectionnez l'élément DOM qui doit être surveillé, cliquez avec le bouton droit de la souris et cochez "Arrêter lorsque les attributs changent" dans le champ. menu. Cela ajoute avec succès un point d'arrêt HTML. Après avoir actualisé la page, Firebug nous aidera également à localiser le code qui modifie l'attribut de l'élément.
En plus de surveiller les modifications de propriétés de l'élément DOM lui-même, Chrome et Firebug peuvent également surveiller les modifications apportées à ses éléments enfants et le moment où l'élément est supprimé.