Jeśli często powtarzasz ten sam kod w konsoli, rozważ zapisanie go jako fragmentu. Fragmenty mają dostęp do kontekstu JavaScript strony. Są alternatywą dla zakładek.
Fragmenty kodu możesz tworzyć w panelu Źródła i uruchamiać je na dowolnej stronie w trybie incognito.
Na przykład ten zrzut ekranu przedstawia po lewej stronie stronę główną dokumentacji Narzędzi deweloperskich i fragment kodu źródłowego w panelu Źródła > Fragmenty po prawej.
Oto fragment kodu źródłowego, który rejestruje komunikat i zastępuje treść HTML strony głównej elementem <p> zawierającym komunikat:
console.log('Hello, Snippets!');
document.body.innerHTML = '';
const p = document.createElement('p');
p.textContent = 'Hello, Snippets!';
document.body.appendChild(p);
Po kliknięciu przycisku 
Uruchom pojawi się szuflada Konsola z komunikatem Hello, Snippets! zarejestrowanym przez fragment kodu i o zmianie treści strony.
Otwórz panel Fragmenty tekstu
Okienko Fragmenty zawiera listę Twoich krótkich opisów. Aby edytować fragment kodu, otwórz go na jeden z dwóch sposobów:
Kliknij Źródła >
> Fragmenty.
W menu poleceń:
- Naciśnij Control+Shift+P (Windows/Linux) lub Command+Shift+P (Mac), aby otworzyć menu poleceń.
- Zacznij pisać
Snippets, wybierz Pokaż fragmenty i naciśnij Enter.
W panelu Źródła>Fragmenty widoczna jest lista zapisanych fragmentów (pusta w tym przykładzie).
Utwórz rozszerzenia informacji
Fragmenty kodu możesz tworzyć w panelu Fragmenty lub po uruchomieniu odpowiedniego polecenia z menu poleceń w dowolnym miejscu w Narzędziach deweloperskich.
Okienko Fragmenty sortuje krótkie opisy w kolejności alfabetycznej.
Tworzenie fragmentu kodu w panelu Źródła
- Otwórz panel Fragmenty.
- Kliknij
Nowy fragment. Wpisz nazwę fragmentu i naciśnij Enter, by go zapisać.
Tworzenie fragmentu kodu w menu poleceń
- Umieść kursor w dowolnym miejscu w Narzędziach deweloperskich.
- Naciśnij Control+Shift+P (Windows/Linux) lub Command+Shift+P (Mac), aby otworzyć menu poleceń.
Zacznij pisać
Snippet, wybierz Utwórz nowy fragment kodu, a następnie naciśnij Enter, aby uruchomić polecenie.
Jeśli chcesz nadać nowemu fragmentowi niestandardową nazwę, zapoznaj się z sekcją Zmienianie nazw krótkich opisów.
Edytowanie fragmentów
- Otwórz panel Fragmenty.
W panelu Fragmenty kliknij nazwę fragmentu, który chcesz edytować. Otworzy się panel Źródła w edytorze kodu.
Użyj edytora kodu, by zmodyfikować kod we fragmencie. Gwiazdka obok nazwy fragmentu oznacza, że zmiany nie zostały jeszcze zapisane.
Naciśnij Control+S (Windows/Linux) lub Command+S (Mac), aby zapisać zmiany.
Fragmenty uruchamiania
Podobnie jak w przypadku tworzenia fragmentu kodu, możesz go uruchomić zarówno w panelu Fragmenty, jak i w menu poleceń.
Uruchamianie fragmentu kodu w panelu Źródła
- Otwórz panel Fragmenty.
- Kliknij nazwę fragmentu, który chcesz uruchomić. Otworzy się panel Źródła w edytorze kodu.
Na pasku działań u dołu edytora kliknij
Uruchom.
lub naciśnij Control+Enter (Windows/Linux) lub Command+Enter (Mac).
Uruchamianie fragmentu kodu z menu poleceń
- Umieść kursor w dowolnym miejscu w Narzędziach deweloperskich.
- Naciśnij Control+O (Windows/Linux) lub Command+O (Mac), aby otworzyć menu Command.
Wpisz znak
!, a po nim nazwę fragmentu, który chcesz uruchomić.
Naciśnij Enter, aby uruchomić fragment kodu.
Zmień nazwy fragmentów
- Otwórz panel Fragmenty.
- Kliknij prawym przyciskiem myszy nazwę rozszerzenia i wybierz Zmień nazwę.
Usuwanie fragmentów
- Otwórz panel Fragmenty.
- Kliknij prawym przyciskiem myszy nazwę fragmentu i wybierz Usuń.