تشغيل مقتطفات 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;

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

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

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

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

لوحة &quot;المقتطفات&quot; فارغة

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

يمكنك إنشاء مقتطفات في لوحة المقتطفات أو عن طريق تنفيذ الأمر المقابل من قائمة الأوامر في أي مكان في 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. اكتب الحرف ! متبوعًا باسم المقتطف الذي تريد تشغيله.

    تشغيل مقتطف من القائمة المفتوحة

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

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

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

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

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