Czy istnieje sposób sprawdzenia, jakie funkcje JavaScriptu (nazwa funkcji) są wykonywane w czasie rzeczywistym w Inspektorze Chrome?

Question

Na przykład, udawaj, że istnieje kod JavaScript, który wykona someFunction() po kliknięciu przycisku i kliknę ten przycisk. Zastanawiam się, czy jest jakiś sposób, aby zobaczyć, że został właśnie wykonany someFunction(). Czy istnieje sposób sprawdzenia, jakie funkcje są wykonywane w Chrome w czasie rzeczywistym?

Jeśli jest to zakładka Profiles w inspektorze, która wykonuje lewę, jak dokładnie można określić, które funkcje będą uruchamiane w czasie rzeczywistym?

EDIT 21.01.2012 12: 36p Pacific: Z komentarzem Briana nikiel jest poniżej, zakładka Oś czasu w Inspector jest sposób, aby zobaczyć, co dzieje się w czasie rzeczywistym, ale jak widzisz nazwy wykonywanych funkcji w na osi czasu?

Answer 1

Do osiągnięcia tego celu można użyć narzędzia programisty Oś czasu i skryptów.

• Otwórz panel narzędzi programistycznych i naciśnij Nagraj w obszarze Oś czasowa, aby rozpocząć śledzenie.
• Wywołaj interesujące Cię wydarzenie (np. W swoim przykładzie, kliknij przycisk), a następnie zatrzymaj nagrywanie (lub kontynuuj nagrywanie, ale poznaj ilość zbieranych danych).
• Zwróć uwagę, że wpisy są zalogowane w panelu Oś czasu. Znajdź odpowiednie wydarzenie i kliknij strzałkę twistie po lewej stronie paska czasu dla tego wydarzenia. Spowoduje to wyświetlenie wywołań funkcji związanych z tym zdarzeniem.
• Kliknij łącze po prawej stronie wywołań funkcji, aby wyświetlić odpowiedni skrypt JavaScript. (Pytasz o nazwę funkcji, ale pamiętaj, że zdarzenie może być powiązane z anonimową funkcją, więc nie zawsze jest dostępna nazwa.)
• Jeśli chcesz przejrzeć samą procedurę obsługi zdarzenia, włóż punkt przerwania w linii po deklaracji programu obsługi (zakładając, że deklaracja programu obsługi zdarzeń jest większa niż jedna linia). Ewentualnie rozwiń punkty przerwania odbiornika zdarzeń w panelu Skrypty i sprawdź odpowiedni typ zdarzenia (zgodnie z listą na panelu Oś czasu dla odpowiedniego zdarzenia). Zauważ, że to podejście będzie działało w każdym wystąpieniu tego zdarzenia, zamiast w jedynej inwokacji, którą jesteś zainteresowany.

Jeśli masz problemy z zminimalizowanym JavaScript i wstawieniem punktów przerwania (ponieważ każda linia jest tak długa), oto wskazówka: otwórz zminiaturyzowany plik skryptu w panelu Skrypty za pomocą rozwijanego menu, a następnie kliknij na {}. Umożliwi to Pretty Print, rozszerzając zminimalizowany kod na coś bardziej czytelnego przez dodanie białych znaków. Pozwala to na wstawianie punktów przerwania w celu zwiększenia ziarnistości. Zwróć uwagę, że jeśli teraz powrócisz do panelu Oś czasu, odniesienia do skryptów (np. jquery.min.js:3) będą teraz korzystać z ładnie wydrukowanych numerów linii, a nie z minified, bez białych.

Answer 2

Istnieje wiele dobrych narzędzi można użyć: console.trace();, debugger itp

Answer 3

Dodawanie do Grace odpowiedź, proszę odwołać się te dwa artykuły także

http://blog.chromium.org/2009/06/developer-tools-for-google-chrome.html

http://www.sagarganatra.com/2011/05/javascript-debugging-with-chrome.html