Как решить проблему возникающую на странице, на которой не используется часть скрипта?

Question

[Петр Сергеев]

Здравствуйте, опишу проблему:
Есть файл script.js в нем есть код для слайдера, а так же код который реализует выпадание меню
Есть две веб страницы и обе они ссылаются на script.js
В первой странице есть слайдер и выпадающее меню
На второй странице есть только выпадающее меню

Так как на второй странице нет слайдера, то JS выдает ошибку, мол слайдер не найден, из-за этого не работает и выпадающее меню.

Как решить данную проблему? Не делать же каждый скрипт в отдельном js файле?

Answer 1

[yarnstart]

Сделайте проверку, найден ли нужный вам dom элемент на странице, например:

let slider = document.getElementById('slider');
if (slider) {
  // код слайдера
}

Хорошая практика при разработке иметь несколько файлов slider.js , dropDown.js и т.д. , а для продакшна посредством сборщиков и таск ранеров (webpack, gulp) собирать все скрипты в один бандл(минифицировать и т.д.)

Comments

[Петр Сергеев]

спасибо за ответ

Answer 2

[Dima Polos]

Еще вариант - try...catch.

Comments

[Петр Сергеев]

Спасибо, буду гуглить