كيفية استبدال $(document).ready() في JavaScript الخالص (Vanilla JS) وتنفيذ الكود بعد تحميل DOM؟

مرحباً بالجميع! لقد بدأت للتو في تعلم JavaScript، وسبق لي العمل قليلاً مع jQuery. كان الأمر سهلاً هناك: لتنفيذ الكود بعد تحميل الصفحة وجاهزية شجرة DOM، كنت أكتب: ```javascript $(document).ready(function() { // الكود الخاص بي }); ``` أو بصيغة مختصرة: ```javascript $(function() { // الكود الخاص بي }); ``` الآن قررت التخلي عن jQuery والكتابة بلغة JavaScript الخالصة (Vanilla JS) لتقليل حجم الصفحة وفهم كيفية عمل كل شيء تحت الغطاء بشكل أفضل. لكنني واجهت مشكلة: كيف يمكنني عمل بديل لـ `$.ready()` بشكل صحيح؟ حاولت استخدام `window.onload`، لكنه يعمل فقط بعد تحميل جميع الصور والأنماط بالكامل، بينما أحتاج إلى تنفيذ الكود فور بناء DOM. على سبيل المثال، أريد إضافة معالجات الأحداث للأزرار أو تغيير النص في العناصر الموجودة بالفعل في HTML. حاولت وضع السكريبت في نهاية `` — وهذا يعمل، لكنني سمعت أن هناك طريقة أكثر صحة. أرجو إرشادي كيف يمكن ذلك في Vanilla JS.