مارکت

اسکریپت برای استخراج داده‌های جدول HTML به اکسل (.xls، .csv) با استفاده از جاوا اسکریپت

در دنیای مدرن توسعه وب، کار با داده‌ها و استخراج اطلاعات از صفحات وب، یکی از نیازهای اصلی برنامه‌نویسان و توسعه‌دهندگان است. به خصوص زمانی که می‌خواهند داده‌های موجود در جداول HTML را به صورت فایل‌های اکسل (.xls) یا فایل‌های متنی CSV (.csv) تبدیل کنند، اهمیت این فرایند به شدت افزایش می‌یابد. در این مقاله، به صورت جامع و کامل، به بررسی نحوه‌ی توسعه و پیاده‌سازی یک اسکریپت جاوا اسکریپت برای استخراج داده‌های جدول HTML و تبدیل آن‌ها به فایل‌های اکسل و CSV می‌پردازیم.
مقدمه
در ابتدا، لازم است بدانیم که جداول HTML، ساختارهای داده‌ای مهمی در صفحات وب هستند. این جداول ممکن است حاوی اطلاعات متنوعی باشند؛ از داده‌های مالی و آماری گرفته تا فهرست محصولات و کاربران. استخراج این داده‌ها به صورت خودکار، نیازمند کدنویسی دقیق و استفاده از فناوری‌های موجود است. جاوا اسکریپت، به عنوان زبان برنامه‌نویسی سمت کلاینت، ابزار قدرتمندی برای این کار است، چرا که قابلیت دسترسی و تغییر DOM را دارد و می‌تواند داده‌ها را به فرمت‌های مختلف تبدیل کند.
مرحله اول: جمع‌آوری داده‌ها از جدول HTML
در این مرحله، باید عناصر جدول (table، tr، td، th) را به صورت دینامیک از صفحه وب استخراج کنیم. این کار با استفاده از Document Object Model (DOM) انجام می‌شود. برای شروع، باید با انتخاب عناصر جدول با کمک توابعی مانند `document.querySelector()` یا `document.querySelectorAll()`، داده‌ها را جمع‌آوری کنیم.
فرض کنید جدول مورد نظر، دارای شناسه‌ای خاص است. در این صورت، می‌توانیم با دستور زیر، تمامی سطرهای جدول را استخراج کنیم:

javascript  

const table = document.querySelector('#myTable');

const rows = table.querySelectorAll('tr');

سپس، برای هر ردیف، باید سلول‌ها را جداگانه استخراج کنیم و محتواهای آن‌ها را در یک آرایه ذخیره کنیم. این کار، معمولاً با حلقه‌های تودرتو انجام می‌شود، به طوری که در هر تکرار، داده‌های هر ردیف جمع‌آوری می‌گردد.
مرحله دوم: تبدیل داده‌ها به فرمت CSV
در این مرحله، پس از جمع‌آوری داده‌ها، نوبت به تبدیل آن‌ها به فرمت CSV می‌رسد. این فرمت، ساده‌ترین و پرکاربردترین قالب برای انتقال داده‌ها است، زیرا به راحتی در برنامه‌های اکسل و دیگر برنامه‌های صفحه گسترده قابل استفاده است.
برای این کار، باید داده‌های هر ردیف را با استفاده از کاما (,) یا سمیکالن (;) جدا کنیم و سپس هر ردیف را در خط جدید قرار دهیم. به عنوان نمونه، فرض کنید داده‌ها در یک آرایه به صورت زیر ذخیره شده است:

javascript  

const data = [

  ['نام', 'سن', 'شغل'],

  ['علی', '۳۰', 'مهندس'],

  ['مریم', '۲۸', 'طراح']

];

برای تبدیل این آرایه به رشته CSV، می‌توانیم از حلقه‌های تکراری یا تابع‌های ساختاری بهره ببریم:

javascript  

const csvContent = data.map(row => row.join(',')).join('\n');

در نهایت، با داشتن رشته CSV، امکان دانلود آن به عنوان فایل، فراهم می‌شود.
مرحله سوم: دانلود فایل CSV و اکسل
برای فراهم کردن قابلیت دانلود فایل، باید داده‌های تولید شده را به صورت فایل به کاربر ارائه دهیم. این کار با استفاده از `Blob` و `URL.createObjectURL()` انجام می‌پذیرد.
در مورد فایل CSV، نمونه کد زیر قابل استفاده است:

javascript  

const blob = new Blob([csvContent], { type: 'text/csv' });

const url = URL.createObjectURL(blob);

const a = document.createElement('a');

a.setAttribute('href', url);

a.setAttribute('download', 'data.csv');

a.click();

برای فایل‌های اکسل، فرآیند کمی پیچیده‌تر است، چون فایل‌های `.xls` و `.xlsx` نیازمند قالب‌های خاص هستند. یکی از راه‌های معمول، استفاده از کتابخانه‌هایی مانند SheetJS (xlsx.js) است، که قابلیت‌های زیادی در زمینه‌ی تولید و خواندن فایل‌های اکسل دارند.
با این کتابخانه، می‌توان داده‌ها را به راحتی به قالب‌های اکسل تبدیل کرد و فایل نهایی را برای دانلود فراهم نمود.
مرحله چهارم: استفاده از کتابخانه‌های خارجی برای فایل‌های XLS
کتابخانه SheetJS، یکی از محبوب‌ترین ابزارها در این زمینه است. در ادامه، نحوه استفاده از این کتابخانه برای تولید فایل XLS را شرح می‌دهیم.
ابتدا، کتابخانه را از طریق CDN یا نصب به پروژه اضافه می‌کنیم:

html  

<script src="https://cdn.jsdelivr.net/npm/xlsx/dist/xlsx.full.min.js"></script>

سپس، داده‌های جدول را به صورت آرایه‌ای از آرایه‌ها یا شیءهای مناسب، به کتابخانه می‌دهیم و فایل اکسل تولید می‌کنیم:

javascript  

const worksheet = XLSX.utils.aoa_to_sheet(data);

const workbook = XLSX.utils.book_new();

XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');

XLSX.writeFile(workbook, 'data.xlsx');

با این روش، کاربر می‌تواند فایل اکسل را به سرعت دانلود کند و داده‌ها را در قالب جدول مشاهده نماید.
مرحله پنجم: نکات مهم و بهینه‌سازی‌ها
در فرآیند استخراج و تبدیل داده‌ها، باید نکات مهمی رعایت گردد. برای نمونه، باید اطمینان حاصل شود که داده‌های جدول به درستی استخراج شده‌اند و قالب‌بندی مناسب دارند. همچنین، در صورت وجود داده‌های خاص، مانند تاریخ‌ها یا اعداد، باید آن‌ها را به صورت مناسب قالب‌بندی کرد.
علاوه بر این، در مواقعی که جدول بزرگ است، بهتر است عملیات‌ها به صورت آسنکرون (async) انجام شوند تا عملکرد صفحه تحت تاثیر قرار نگیرد. استفاده از ویژگی‌های ES6 مانند `async/await` و `Promises`، در این زمینه مفید است.
در نهایت، برای بهبود کارایی، می‌توان اسکریپت را به گونه‌ای طراحی کرد که بتواند چندین جدول را همزمان پردازش کند، و یا قابلیت‌های پیشرفته‌تری مانند فیلتر کردن و مرتب‌سازی داده‌ها را نیز فراهم آورد.
جمع‌بندی
در این مقاله، سعی شد که به صورت جامع و کامل، نحوه‌ی توسعه یک اسکریپت در جاوا اسکریپت برای استخراج داده‌های جدول HTML و تبدیل آن‌ها به فایل‌های اکسل و CSV شرح داده شود. این فرآیند، با استفاده از DOM، حلقه‌ها، و کتابخانه‌های خارجی مانند SheetJS، امکان‌پذیر است و به توسعه‌دهندگان کمک می‌کند تا داده‌های وب‌سایت‌ها را به صورت خودکار و سریع استخراج و در قالب فایل‌های قابل استفاده در برنامه‌های صفحه گسترده، ذخیره کنند. این نوع ابزار، در کسب‌وکارهای مختلف، تحلیل داده، و اتوماسیون فرآیندهای کاری، نقش بسزایی دارد و بهبود بهره‌وری را به همراه دارد.