אם אתם מריצים את אותו קוד במסוף שוב ושוב, כדאי לשמור את הקוד כקטע קוד. לקטעי הקוד יש גישה להקשר של ה-JavaScript בדף. הם מהווים חלופה לסימניות.
אתם יכולים ליצור קטעי קוד בחלונית Sources ולהריץ אותם בכל דף ובמצב פרטי.
לדוגמה, בצילום המסך שבהמשך מוצג דף הבית של התיעוד של כלי הפיתוח בצד ימין, וקוד מקור של קטע קוד בחלונית מקורות > קטעי קוד בצד שמאל.

זהו קוד המקור של קטע הקוד שמתעד הודעה כלשהי ומחליף את גוף ה-HTML של דף הבית ברכיב <p> שמכיל את ההודעה:
console.log('Hello, Snippets!');
document.body.innerHTML = '';
const p = document.createElement('p');
p.textContent = 'Hello, Snippets!';
document.body.appendChild(p);
כשלוחצים על הלחצן Run, חלונית ההזזה של המסוף נפתחת ומוצגת בה ההודעה
Hello, Snippets! שקטע הקוד מתעד, והתוכן של הדף משתנה.

פתיחת החלונית "קטעי קוד"
החלונית Snippets מציגה את קטעי הקוד. כדי לערוך קטע קוד, פותחים אותו באחת משתי דרכים:
עוברים אל Sources >
> Snippets.

-
- מקישים על Control+Shift+P (ב-Windows או ב-Linux) או על Command+Shift+P (ב-Mac) כדי לפתוח את תפריט הפקודות.
- מתחילים להקליד
Snippets, בוחרים באפשרות הצגת קטעי קוד ולוחצים על Enter.

בחלונית Sources (מקורות) > Snippets (קטעי קוד) מוצגת רשימה של קטעי הקוד ששמרתם. בדוגמה הזו הרשימה ריקה.

יצירת נכסי מידע מובנה
אפשר ליצור קטעי קוד בחלונית קטעי קוד או על ידי הפעלת הפקודה המתאימה מתפריט הפקודות בכל מקום בכלי הפיתוח.
בחלונית קטעי קוד, קטעי הקוד ממוינים בסדר אלפביתי.
יצירת קטע קוד בחלונית Sources (מקורות)
- פותחים את החלונית Snippets.
- לוחצים על
קטע קוד חדש.
נותנים שם ל-snippet ולוחצים על Enter כדי לשמור.

יצירת קטע קוד מתפריט הפקודות
- מציבים את הסמן במקום כלשהו בתוך כלי הפיתוח.
- מקישים על Control+Shift+P (ב-Windows או ב-Linux) או על Command+Shift+P (ב-Mac) כדי לפתוח את תפריט הפקודות.
מתחילים להקליד
Snippet, בוחרים באפשרות יצירת קטע קוד חדש ולוחצים על Enter כדי להריץ את הפקודה.
אם רוצים לתת לקטע הקוד החדש שם מותאם אישית, אפשר לעיין בקטע שינוי השם של קטעי קוד.
עריכת קטעי קוד
- פותחים את החלונית Snippets.
בחלונית Snippets, לוחצים על שם קטע הקוד שרוצים לערוך. החלונית מקורות פותחת את הקובץ בכלי לעריכת קוד.

משתמשים בעורך הקוד כדי לערוך את הקוד בקטע הקוד. כוכבית ליד שם קטע הקוד מציינת שעדיין לא שמרתם את השינויים.

כדי לשמור, לוחצים על Control+S (ב-Windows או ב-Linux) או על Command+S (ב-Mac).
הרצת קטעי קוד
בדומה ליצירת קטע קוד, אפשר להריץ אותו גם בחלונית Snippets וגם מ-Command Menu.
הרצת קטע קוד בחלונית Sources (מקורות)
- פותחים את החלונית Snippets.
- לוחצים על השם של קטע הקוד שרוצים להריץ. החלונית מקורות פותחת את הקובץ בכלי לעריכת קוד.
לוחצים על
Run בסרגל הפעולות שבתחתית כלי העריכה, או מקישים על Control+Enter (ב-Windows או ב-Linux) או על Command+Enter (ב-Mac).

הרצת קטע קוד מתפריט הפקודות
- מציבים את הסמן במקום כלשהו בתוך כלי הפיתוח.
- מקישים על Control+O (ב-Windows או ב-Linux) או על Command+O (ב-Mac) כדי לפתוח את תפריט הפקודות.
מקלידים את התו
!ואחריו את שם קטע הקוד שרוצים להריץ.
מקישים על Enter כדי להריץ את קטע הקוד.
שינוי השם של קטעי הקוד
- פותחים את החלונית Snippets.
- לוחצים לחיצה ימנית על שם ה-snippet ובוחרים באפשרות שינוי שם.
מחיקת קטעי קוד
- פותחים את החלונית Snippets.
- לוחצים לחיצה ימנית על שם ה-snippet ובוחרים באפשרות הסרה.