تشغيل مقتطفات JavaScript

Kayce Basques
Sofia Emelianova
Sofia Emelianova
GitHub

إذا كنت تُجري الرمز نفسه في Console بشكل متكرّر، ننصحك بحفظ الرمز كقتطف بدلاً من ذلك. يمكن للمقتطفات الوصول إلى سياق JavaScript للصفحة. وهي بديل عن العلامات المرجعية الصغيرة.

يمكنك إنشاء مقتطفات في لوحة المصادر وتنفيذها على أي صفحة وفي وضع التصفّح المتخفي.

على سبيل المثال، تعرض لقطة الشاشة أدناه الصفحة الرئيسية لمستندات "أدوات مطوّري البرامج" على يمين الشاشة وبعض الرموز البرمجية لمقتطفات في لوحة المصادر > المقتطفات على يمين الشاشة.

الصفحة الرئيسية لمستندات "أدوات مطوّري البرامج" قبل تشغيل المقتطف يتم تمييز الزر "تشغيل".

في ما يلي رمز المصدر للمقتطف الذي يسجّل بعض الرسائل ويستبدل نص HTML للصفحة الرئيسية بعنصر <p> يحتوي على الرسالة:

console.log('Hello, Snippets!');
document.body.innerHTML = '';
const p = document.createElement('p');
p.textContent = 'Hello, Snippets!';
document.body.appendChild(p);

عند النقر على الزر تشغيل. تشغيل، ينبثق درج وحدة التحكّم لعرض رسالة Hello, Snippets! التي يسجّلها المقتطف، ويتغيّر محتوى الصفحة.

الصفحة الرئيسية بعد تشغيل المقتطف

افتح لوحة "المقتطفات".

تعرض لوحة المقتطفات مقتطفاتك. لتعديل مقتطف، افتحه بإحدى الطريقتَين التاليتَين:

  1. انتقِل إلى المصادر > المزيد من علامات التبويب > المقتطفات.

    قائمة &quot;المزيد من علامات التبويب&quot; في لوحة &quot;المصادر&quot; (Sources).

  2. من قائمة الأوامر:

    1. اضغط على Control+Shift+P (Windows/Linux) أو Command+Shift+P (Mac) لفتح قائمة الأوامر.
    2. ابدأ كتابة Snippets، ثم اختَر إظهار المقتطفات واضغط على Enter.

    اختيار &quot;عرض المقتطفات&quot; من قائمة الأوامر.

يعرض لوحة المصادر&gt;المقتطفات قائمة بالمقتطفات التي حفظتها، فارغة في هذا المثال.

لوحة مقتطفات فارغة.

إنشاء مقتطفات

يمكنك إنشاء مقتطفات في لوحة المقتطفات أو عن طريق تنفيذ الأمر المقابل من قائمة الأوامر في أي مكان في DevTools.

تُرتّب لوحة المقتطفات المقتطفات أبجديًا.

إنشاء مقتطف في لوحة "المصادر"

  1. افتح لوحة المقتطفات.
  2. انقر على مقتطف جديد مقتطف جديد.

  3. أدخِل اسمًا للمقتطف واضغط على Enter لحفظه.

    تسمية مقتطف

إنشاء مقتطف من قائمة الطلبات

  1. ركِّز المؤشر في أي مكان داخل "أدوات مطوّري البرامج".
  2. اضغط على Control+Shift+P (Windows/Linux) أو Command+Shift+P (Mac) لفتح قائمة الأوامر.

  3. ابدأ بكتابة Snippet، ثم اختَر إنشاء مقتطف جديد، ثم اضغط على Enter لتشغيل الأمر.

    تحديد &quot;إنشاء مقتطف جديد&quot; من قائمة الأوامر.

اطّلِع على إعادة تسمية المقتطفات إذا أردت منح المقتطف الجديد اسمًا مخصّصًا.

تعديل المقتطفات

  1. افتح لوحة المقتطفات.

  2. في لوحة المقتطفات، انقر على اسم المقتطف الذي تريد تعديله. تفتح لوحة المصادر الملف في محرِّر الرموز البرمجية.

    مقتطف تم فتحه في &quot;محرِّر الرموز&quot;

  3. استخدِم أداة تعديل الرموز لتعديل الرمز في المقتطف. تشير علامة النجمة بجانب اسم المقتطف إلى أنّه لم يتم حفظ التغييرات بعد.

    علامة نجمة بجانب اسم المقتطف تشير إلى رمز غير محفوظ

  4. اضغط على Control+S (Windows/Linux) أو Command+S (Mac) للحفظ.

تنفيذ المقتطفات

تمامًا مثل إنشاء مقتطف، يمكنك تشغيله في كلّ من لوحة المقتطفات ومن قائمة الطلبات.

تنفيذ مقتطف في لوحة "المصادر"

  1. افتح لوحة المقتطفات.
  2. انقر على اسم المقتطف الذي تريد تشغيله. تفتح لوحة المصادر الملف في محرِّر الرموز البرمجية.

  3. انقر على تشغيل. تشغيل في شريط الإجراءات في أسفل المحرِّر، أو اضغط على Control+Enter (Windows/Linux) أو Command+Enter (Mac).

    الزر &quot;تشغيل&quot;.

تنفيذ مقتطف من "قائمة الأوامر"

  1. ركِّز على أي موضع داخل "أدوات مطوري البرامج".
  2. اضغط على Control+O (نظام التشغيل Windows/Linux) أو Command+O (نظام التشغيل Mac) لفتح قائمة الأوامر.

  3. اكتب الحرف ! متبوعًا باسم المقتطف الذي تريد تشغيله.

    تشغيل مقتطف من القائمة &quot;فتح&quot;

  4. اضغط على Enter لتشغيل المقتطف.

إعادة تسمية المقتطفات

  1. افتح لوحة المقتطفات.
  2. انقر بزر الماوس الأيمن على اسم المقتطف واختَر إعادة التسمية.

حذف المقتطفات

  1. افتح لوحة المقتطفات.
  2. انقر بزر الماوس الأيمن على اسم المقتطف واختَر إزالة.