Mam ~ 100-200 funkcji javascript załadowanych na stronie internetowej. Chcę określić, jaka funkcja javascript jest wykonywana po kliknięciu jednego lub drugiego elementu w Google Chrome. Jak mogę to zrobić za pomocą Narzędzi dla programistów w przeglądarce Chrome? Dzięki!Śledzenie wykonywania kodu JavaScript w Chrome - jak?
Jednym z prostych sposobów jest uruchomienie Narzędzi dla programistów Chrome, przejście do panelu Źródła i kliknięcie przycisku F8 (Wstrzymaj wykonywanie). Spowoduje to przerwanie pierwszej wykonanej instrukcji JavaScript.
Innym podejściem jest ustawienie punktu przerwania detektora zdarzeń dla mousedown lub kliknięcie: w tym samym panelu Źródła rozwiń "Punkty przerwania odbiornika zdarzeń" na prawym pasku bocznym. Rozwiń element "Mysz" i sprawdź zdarzenia, które chcesz przełamać (np. "Kliknij", "mousedown"). Następnie kliknij na swojej stronie i zobacz przerwanie wykonywania JS w DevTools. Cieszyć się!
Chcę określić, jaka funkcja javascript jest wykonywana, gdy klikam jeden lub drugi element w Google Chrome.
To jest świetne rozszerzenie o nazwie Visual Event, które dokładnie to robi. Rozpoznaje tylko programy obsługi zdarzeń ustawione za pomocą popularnych bibliotek js (jQuery, YUI, MooTools, Prototype, Glow) i zdarzeń DOM Level 0.
działa dobrze. Nie jestem pewien bezpieczeństwa, więc zostawiam, kiedy nie debuguję. – MagicLAMP
Alternatywą wstrzymując wykonanie (który zwykle działa świetnie, ale nie działa dobrze na stronach, które często wykonywać kod okresowe)
Można użyć profilera Chrome nagrać na krótki okres czasu. Po zakończeniu nagrywania pojawi się podsumowanie czasu procesora spędzonego w dowolnej funkcji, która została wykonana podczas nagrywania. Naprawdę nie zależy nam na czasie procesora, używaliśmy tego narzędzia, ponieważ pokaże nam, które funkcje zostały wykonane.
zasadzie tylko rozpocząć nagrywanie:
Następnie zrobić swoje działanie (np, kliknij przycisk na stronie internetowej, lub zrobić cokolwiek spowoduje interesujący kod do wykonania). Następnie zatrzymać nagrywanie i wyświetlić wynik:
Wskazówka używam „odgórne” tryb wyświetlania - co pokazuje stos wywołań, można drążyć, aby zobaczyć, jakie funkcje ostatecznie został sprawdzony. Na przykład, pewna anonimowa funkcja została wywołana jako pierwsza (prawdopodobnie w wyniku setTimeout lub może jakiegoś programu obsługi zdarzeń kliknięcia), a następnie wywołała pewną metodę zidentyfikowaną przez s.track.s.t, która następnie nazywała się s_doPlugins itd. Ważne jest to, że na górze w dół, wpisy na górze drzewa tworzą początek stosu wywołań, więc zwykle są to funkcja zarejestrowana przez funkcję zegara (setTimeout, setInterval, requestAnimationFrame, itp.) lub niektóre funkcje obsługi zdarzeń (click , mousemove, load, itp.).
Można również użyć trybu wyświetlania "wykresu", który pokazuje, która funkcja została wywołana w danym momencie, wykreślona na wykresie od lewej do prawej. Pomaga to w określeniu, której funkcji naprawdę szukasz, ponieważ prawdopodobnie masz pojęcie o czasie wykonania kodu w nagraniu (np. W środku).
btw - Wierzę, że większość innych nowoczesnych przeglądarek ma podobne możliwości.
thx wiele! jakie zdarzenie myszy powinienem złapać, jeśli wybiorę tekst w FCKeditor, "kliknięcie lewym klawiszem myszy", przeniesie mysz do innego miejsca i zwolni. – Pave
Być może "mouseup". Jednak nie zna się na FCKedycie. –
Próbowałem, ale ... nadal nie działa ... spróbuję sam. dzięki! – Pave