مرجع واجهة برمجة تطبيقات Console Utilities API

يستخدم المثال التالي السمة $$() to create an array of all <img> elements in the current document and displays the value of each element's src property:

let images = $$('img');
for (let each of images) {
  console.log(each.src);
}

l10n-placeholder3() لإنشاء مصفوفة من كل عناصر <img>
التي تظهر في المستند الحالي بعد العقدة المحددة:
let images = $$('img', document.querySelector('.devsite-header-background'));
for (let each of images) {
  console.log(each.src);
}





$x(path [, startNode])

تعرض الدالة $x(path) صفيفًا من عناصر DOM التي تطابق تعبير XPath المحدد.

على سبيل المثال، تعرض ما يلي جميع عناصر <p> في الصفحة:
$x("//p")



يعرض المثال التالي جميع عناصر <p> التي تتضمّن عناصر <a>:
$x("//p[a]")



على غرار دوال المحدِّد الأخرى، يتضمّن $x(path) مَعلمة ثانية اختيارية، startNode، تحدّد عنصرًا أو عقدة يتم البحث من خلالها عن العناصر.



()clear

يمحو clear() وحدة التحكّم من سجلّها.
clear();

Copy(object)

ينسخ copy(object) تمثيل سلسلة للعنصر المحدَّد إلى الحافظة.
copy($0);

تصحيح(الوظيفة)

عند استدعاء الدالة المحددة، يتم استدعاء برنامج تصحيح الأخطاء وينقطع داخل الدالة في لوحة المصادر ما يسمح بالتنقل عبر الرمز وتصحيح الأخطاء.
debug(getData);



يمكنك استخدام undebug(fn) للتوقّف عن إيقاف الدالة، أو استخدام واجهة المستخدم لإيقاف جميع نقاط الإيقاف.

لمزيد من المعلومات عن نقاط الإيقاف، يُرجى الاطّلاع على مقالة إيقاف الرمز مؤقتًا باستخدام نقاط الإيقاف.

dir(object)

تعرض dir(object) قائمة بنمط الكائن بكل خصائص العنصر المحدّد. هذه الطريقة هي اختصار لطريقة console.dir() في Console API.

يوضح المثال التالي الفرق بين تقييم document.body مباشرةً في
سطر الأوامر، واستخدام dir() لعرض العنصر نفسه:
document.body;
dir(document.body);



لمزيد من المعلومات، يُرجى الاطّلاع على إدخال console.dir() في Console API.

dirxml(object)

تطبع dirxml(object) تمثيل XML للكائن المحدّد، كما هو موضّح في لوحة العناصر.
هذه الطريقة مكافئة لطريقة console.dirxml().

inspect(object/function)

يفتح inspect(object/function) ويختار العنصر أو العنصر المحدّد في اللوحة المناسبة: إمّا لوحة العناصر لعناصر DOM أو لوحة الملفات الشخصية لعناصر عناصر JavaScript المتعدّدة.

يفتح المثال التالي document.body في لوحة العناصر:
inspect(document.body);



عند تمرير دالة لفحصها، تفتح الدالة المستند في لوحة المصادر لتتمكّن من فحصه.

getEventListeners(object)

تعرض الدالة getEventListeners(object) أدوات معالجة الأحداث المسجَّلة في الكائن المحدّد. قيمة العرض هي عنصر يحتوي على مصفوفة لكل نوع حدث مسجَّل (click أو keydown، على سبيل المثال). أعضاء كل صفيفة هم كائنات تصف المستمع المسجَّل لكل نوع. على سبيل المثال، تسرد القوائم التالية جميع أدوات معالجة الأحداث المسجَّلة في كائن المستند:
getEventListeners(document);



إذا تم تسجيل أكثر من مستمع واحد في الكائن المحدد، فإن الصفيفة تحتوي على عضو لكل مستمع. في المثال التالي، هناك نوعان من أدوات معالجة الأحداث المسجّلين في
عنصر المستند لحدث click:



يمكنك توسيع كل عنصر من هذه العناصر لاستكشاف خصائصها:



لمزيد من المعلومات، يُرجى الاطّلاع على فحص خصائص العناصر.

مفاتيح(كائن)

تعرض keys(object) صفيفًا يحتوي على أسماء السمات التي تنتمي إلى الكائن المحدّد. للحصول على القيم المرتبطة بالخصائص نفسها، استخدِم values().

على سبيل المثال، لنفترض أن التطبيق عرّف العنصر التالي:
let player = {
    "name": "Parzival",
    "number": 1,
    "state": "ready",
    "easterEggs": 3
};

بافتراض تحديد player في مساحة الاسم العامة (لتبسيط العملية)، ستؤدي كتابة keys(player)
وvalues(player) في وحدة التحكّم إلى ما يلي:



monitor(function)

عند استدعاء الدالة المحددة، يتم تسجيل رسالة بوحدة التحكم تشير إلى اسم الدالة إلى جانب الوسيطات التي تم تمريرها إلى الدالة عند استدعائها.
function sum(x, y) {
  return x + y;
}
monitor(sum);



يمكنك استخدام unmonitor(function) لإيقاف التتبُّع.

monitorEvents(object [, events])

عند وقوع أحد الأحداث المحددة على الكائن المحدد، يتم تسجيل كائن الحدث في وحدة التحكم. يمكنك تحديد حدث واحد لمراقبته، أو مجموعة من الأحداث، أو أحد "أنواع" الأحداث العامة
المرتبطة بمجموعة محدَّدة من الأحداث. راجِع الأمثلة أدناه.

يراقب ما يلي جميع أحداث تغيير الحجم في كائن النافذة.
monitorEvents(window, "resize");



في ما يلي تعريف صفيف لمراقبة كل من حدثَي "تغيير الحجم" و "التمرير" في كائن النافذة:
monitorEvents(window, ["resize", "scroll"])

ويمكنك أيضًا تحديد أحد "أنواع" الأحداث المتاحة، وهي سلاسل يتم تعيينها إلى مجموعات محدّدة مسبقًا من الأحداث. يسرد الجدول التالي أنواع الأحداث المتاحة وعمليات ربط الأحداث المرتبطة بها:

نوع الحدث والأحداث المرتبطة المقابلة
فأر
"الماوس"، "الماوس"، "النقر"، "dblclick"، "الماوس"، "الماوس"، "الماوس"، "الماوس"
مفتاح
"keydown"، "keyup"، "keypress"، "textInput"
لمس
" touchstart"، " touchmove"، "Touchend"، "إلغاء اللمس"
في مستوى الصوت
"تغيير الحجم"، "التمرير"، "تكبير"، "التركيز"، "تمويه"، "اختيار"، "تغيير"، "إرسال"، "إعادة ضبط"

على سبيل المثال، يتم في ما يلي استخدام نوع الحدث "المفتاح" هو جميع الأحداث الرئيسية المقابلة في حقل نص إدخال
مُختار حاليًا في لوحة العناصر.
monitorEvents($0, "key");

في ما يلي نموذج للمخرجات بعد كتابة أحرف في حقل النص:



يمكنك استخدام unmonitorEvents(object[, events]) لإيقاف التتبُّع.

الملف الشخصي([name]) وprofileEnd([name])

يبدأ profile() جلسة تحليل وحدة المعالجة المركزية (CPU) بلغة JavaScript باستخدام اسم اختياري. profileEnd()
يُكمل الملف الشخصي ويعرض النتائج في الأداء > الأغنية الرئيسية.



لبدء إنشاء الملفات التعريفية:
profile("Profile 1")

لإيقاف إنشاء الملفات التعريفية والاطّلاع على النتائج في الأداء > المسار الرئيسي:
profileEnd("Profile 1")

النتيجة في الأداء > الأغنية الرئيسية:

 المسار الرئيسي." العرض="800" height="606">

يمكن أيضًا دمج الملفات الشخصية. على سبيل المثال، سيعمل ذلك بأي ترتيب:
profile('A');
profile('B');
profileEnd('A');
profileEnd('B');



queryObjects(Constructor)

يمكنك طلب queryObjects(Constructor) من وحدة التحكّم لعرض مصفوفة من العناصر التي تم إنشاؤها باستخدام الدالة الإنشائية المحددة. مثلاً:


queryObjects(Promise). تعرض جميع حالات Promise.
queryObjects(HTMLElement). تعرض جميع عناصر HTML.
queryObjects(foo)، حيث foo هو اسم صف. تعرض جميع الكائنات التي تم إنشاء مثيلها عبر new foo().


نطاق queryObjects() هو سياق التنفيذ المحدّد حاليًا في وحدة التحكّم.

table(data [, column])

تسجيل بيانات العناصر بتنسيق جدول عن طريق تمرير عنصر بيانات مع عناوين أعمدة اختيارية.
هذا اختصار لـ console.table().

على سبيل المثال، لعرض قائمة بالأسماء باستخدام جدول في وحدة التحكّم، ستفعل:
let names = [
  { firstName: "John", lastName: "Smith" },
  { firstName: "Jane", lastName: "Doe" },
];
table(names);



undebug(function)

يوقف undebug(function) تصحيح الأخطاء للدالة المحدّدة، بحيث لا يتم استدعاء دالة تصحيح الأخطاء عند استدعاء الدالة. يتم استخدام هذا الإذن بالتعاون مع debug(fn).
undebug(getData);

إلغاء المراقبة(الدالة)

يوقف unmonitor(function) مراقبة الدالة المحددة. يتم استخدام هذه السمة جنبًا إلى جنب مع
monitor(fn).
unmonitor(getData);

unmonitorEvents(object [, events])

يتوقف تطبيق "unmonitorEvents(object[, events])" عن مراقبة الأحداث للعنصر والأحداث المحدّدة. على سبيل المثال، يؤدي ما يلي إلى إيقاف مراقبة جميع الأحداث على كائن النافذة:
unmonitorEvents(window);

يمكنك أيضًا اختيار إيقاف مراقبة أحداث معيّنة على أحد العناصر. على سبيل المثال، يبدأ الرمز التالي في مراقبة جميع أحداث الماوس على العنصر المحدّد حاليًا، ثم يتوقف عن رصد أحداث "mousemove" (ربما لتقليل التشويش في إخراج وحدة التحكّم):
monitorEvents($0, "mouse");
unmonitorEvents($0, "mousemove");

القيم(object)

تعرض values(object) صفيفًا يحتوي على قيم جميع السمات التي تنتمي إلى الكائن المحدّد.
let player = {
    "name": "Parzival",
    "number": 1,
    "state": "ready",
    "easterEggs": 3
};

values(player);