Эквивалент $(document).ready без использования jQuery

Проблема, с которой может столкнуться разработчик, заключается в том, что он хочет использовать функцию $(document).ready из библиотеки jQuery, но не хочет подключать всю библиотеку ради этого. Это может быть связано с желанием оптимизировать проект и уменьшить его вес.

В качестве примера можно привести код, использующий $(document).ready:

$(document).ready(function() {
   // Ваш код
});

Если в проекте больше ничего из jQuery не используется, то подключение этой библиотеки будет излишним.

Решение

Существует несколько способов решения этой проблемы, которые не требуют использования jQuery.

Первый способ — это использование события DOMContentLoaded. Оно возникает, когда весь HTML был полностью загружен и проанализирован, не дожидаясь окончания загрузки стилей, изображений и фреймов. Вот как это выглядит:

document.addEventListener("DOMContentLoaded", function() {
  // Ваш код
});

Второй способ — это использование window.onload. Однако стоит отметить, что window.onload срабатывает позже, чем DOMContentLoaded, так как ожидает полной загрузки всех ресурсов (включая изображения, стили, фреймы).

window.onload = function() {
  // Ваш код
};

Однако, если важно, чтобы код выполнился именно после полной загрузки страницы, то лучше использовать window.onload.

Таким образом, можно заменить $(document).ready на нативный JavaScript, убрав тем самым необходимость в подключении jQuery.