Aby śledzić zmiany w kodzie wprowadzone w Narzędziach deweloperskich, użyj panelu Zmiany.
Omówienie
Za pomocą panelu Zmiany możesz śledzić wprowadzone zmiany:
- Kod HTML w sekcji Źródła z włączonymi zastąpieniami lokalnymi
- CSS w sekcji Elementy > Style lub Źródła
- JavaScript w sekcji Źródła
Panel Zmiany pokazuje tylko zmiany wprowadzone w Narzędziach deweloperskich. Jeśli załadujesz ponownie Narzędzia deweloperskie lub stronę, zmiany znikną.
Aby zapewnić zachowywanie zmian w Narzędziach deweloperskich po wczytaniu strony, wykonaj czynności opisane w artykule Zastąpienia lokalne.
Aby w Narzędziach deweloperskich wprowadzić zmiany w źródłach lokalnych, wykonaj czynności opisane w artykule Edytowanie i zapisywanie plików w obszarach roboczych.
Otwórz panel Zmiany
Aby otworzyć panel Zmiany:
Naciśnij Command + Shift + P (Mac) lub Control + Shift + P (Windows, Linux, ChromeOS), aby otworzyć menu poleceń.
Zacznij pisać
changes
, wybierz Pokaż zmiany i naciśnij Enter.
Możesz też w prawym górnym rogu kliknąć Dostosuj i kontroluj Narzędzia deweloperskie > Więcej narzędzi > Zmiany.
Domyślnie Narzędzia deweloperskie wyświetlają w panelu panel Zmiany u dołu okna Narzędzia deweloperskie.
Wyświetlanie i analizowanie zmian
Aby wyświetlić zmiany:
- Otwórz Narzędzia deweloperskie.
Wprowadź zmiany w źródłach:
- HTML: najpierw włącz Lokalne zastąpienia, a następnie wprowadź zmiany w sekcji Źródła
- CSS w sekcji Elementy > Style lub Źródła
- JavaScript w sekcji Źródła
Otwórz panel Zmiany i wybierz plik po prawej stronie panelu.
Zwróć uwagę na dane wyjściowe funkcji
diff
, które wyróżniają te elementy:
W panelu Zmiany automatycznie wydrukowane są dane wyjściowe diff
, dzięki czemu nie trzeba przewijać ekranu w poziomie, by zobaczyć zmiany w jednym wierszu.
Skopiuj zmiany CSS
Jeśli wprowadzisz zmiany w CSS w sekcji Elementy > Style, możesz skopiować je wszystkie jednym przyciskiem:
Otwórz panel Zmiany i po prawej stronie panelu wybierz plik CSS, w którym wprowadzono zmiany.
Kliknij przycisk Kopiuj u dołu panelu Zmiany.
Cofanie wszystkich zmian wprowadzonych w pliku
Aby cofnąć zmiany wprowadzone w pliku:
- Po lewej stronie panelu Zmiany wybierz plik ze zmianami, które chcesz cofnąć.
- Na pasku działań u dołu kliknij Cofnij wszystkie zmiany w bieżącym pliku.