كائن الملف

اكتشف ما هو كائن ملف وكيفية استخدامه

توفر لنا المتصفحات ملفFileموضوع.

كائن الملف هو ملفسائل لزجكائن ، ويوفر 3 خصائص فوقها:

وهو ما يضيف إلىBlobخصائص الموضوع:

  • size(الحجم بالبايت)
  • type(نوع MIME)

سوف تتلقى ملفFileالكائن عند التفاعل معFileList، والتي يمكن استردادها من نموذج HTML بامتداد<input type="file" />أو عند التفاعل معهاالسحب والإفلات.

عندما تحصل على ملفFileListكائن ، عندما تقوم بعمل حلقة فوقها أو تختار عنصرًا (على سبيل المثال العنصر الأول معmyFileList[0]) ستحصل على ملفFileموضوع.

لنفترض أن لديك ملفinput type="file"عنصر في النموذج الخاص بك:

<input type="file" />

الآن يمكنك الاستماع إلىchangeحدث على هذا العنصر ، لذلك عندما تختار ملفًا ستحصل على معلومات عنه.document.querySelector('input').filesسيعود أFileListكائن ، كما هو موضح أعلاه ، واستخدام[0]نحمل الملف الأول ، ويمكننا الوصول إلى جميع الخصائص التي نحتاجها من ملفFileموضوع:

document.querySelector('input').addEventListener('change', () => {
  const file = document.querySelector('input').files[0]
  alert(`The file ${file.name} was last modified on ${new Date(file.lastModified).toDateString()}`)
})

انظر القلمعرض كائن الملفبقلم فلافيو كوبس (تضمين التغريدة) تشغيلكود.

Tech Wiki Online!