document is not defined في بيئة node

السبب في ظهور الخطأ عندما تقوم بعمل run في ال terminal باستخدام node هو أن الأكواد أصبحت تعمل في بيئة node و ليس المتصفح.

ف Node.js هي JavaScript runtime environment أي بيئة تشغيل JavaScript، التي تستطيع تشغيل شيفرة JavaScript خارج المتصفحات. حيث أن اللغة كانت تعمل في المتصفحات فقط  سابقًا.

و الكائن document هو كائن يوفره لنا المتصفح و ليس مدعوم من اللغة نفسها، لذلك لا يمكن استخدام الكائن document في بيئة العمل node حيث ستظهر لك رسالة خطأ تخبرك أنه غير معرف كما حدث معك:

اقتباس

ReferenceError: document is not defined

يجب وضع ملف استدعاء جافاسكريبت قبل وسم نهاية body بهذا الشكل 

<sctipt type="text/javascript" src="jsfile.js"></script>
</body>
</html>

ثم يجب عليك فتح ملف index.html في المتصفح و ليس باستخدام ملف jsfile.js بحيث عندما تقوم بفتح ملف index.html لن تظهر لك هذه المشكلة . 

و عندما اضعه في المتصفح استطيع استدعائه

بتاريخ الآن قال Mohammmed Mahmoud:

و عندما اضعه في المتصفح استطيع استدعائه

صحيح ، يتم جلب ملف jsfile.js  في الصفحة و يمكنك استخدام جافاسكريبت في الصفحة ، إذا كان الملف غير مدرج في الصفحة فيجب التأكد من مساره و أو اسم الملف عند استدعائه كما في السطر التالي 

<script type="text/javascript" src="jsfile.js"></script>

شكرا لك قمت بوضع كود JS في اخر الصفحه و عمل و لكن ما الفرق بين وضعه في ال head و   body

 و شكرا لكم 

بتاريخ 12 دقائق مضت قال Mohammmed Mahmoud:

شكرا لك قمت بوضع كود JS في اخر الصفحه و عمل و لكن ما الفرق بين وضعه في ال head و   body

 و شكرا لكم 

لاحظ أن سبب الخطأ هو أن أكواد الجافاسكربت حالياً يتم تنفيذها قبل أن تتحمل عناصر الصفحة لأنه تم وضع الملف قبل وسم إغلاق head و بالتالي لنضمن أن عناصر الصفحة قد تم تحميلها كاملاً قبل تحميل ملف الجافاسكربت نقوم بوضع سطر استدعاء ملف الجافاسكربت قبل وسم إغلاق body فهذه أفضل طريقة لتجنب مثل هذه الأخطاء. 

بتاريخ 2 ساعات قال Mohammmed Mahmoud:

شكرا لك قمت بوضع كود JS في اخر الصفحه و عمل و لكن ما الفرق بين وضعه في ال head و   body

 و شكرا لكم 

يمكننا وضع الملف بداخل العنصرين , ولكن أحيانا قد تواجهنا مشاكل عند وضعه في عنصر head ,عند وضعه بداخل العنصر head يتم استدعائه قبل انشاء عناصر html وبالتالي عند الوصول لعنصر ما لن يتم الوصول اليه لأنه لم يجده وسوف تكون النتيجة undefined ,لا يحدث ذلك دائما , يحدث عند محاولة الحصول على عنصر لم يتم انشائه بعد ولكن لو كان الكود عبارة عن دالة يتم تنفيذها بعد الضغط على عنصر ما فلن تواجه مشكلة في ذلك,يمكننا حل المشكلة من خلال استدعاء ملفات جافاسكربت في نهاية العنصر body فنضمن دائما ان العناصر تم انشائها وسوف يتم الوصول اليها دائما