Отпимизация скрипта

126
15 апреля 2021, 09:20

Всем привет. сейчас будет очень тупой вопрос. Не подскажете как опитмизировать этот скрипт? видел примеры,можно делать this.href и прочее, но у меня не вышло, можете подсказать?

$(document).ready(function() {
    if (window.location.href.indexOf("#slide-1") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-1").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-2") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-2").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-3") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-3").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-4") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-4").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-5") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-5").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-6") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-6").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-7") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-7").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-8") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-8").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-9") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-9").offset().top
    }, 2000);
    } else if (window.location.href.indexOf("#slide-12") > -1) {
      $('html, body').animate({
        scrollTop: $("#slide-12").offset().top
    }, 2000);
    }
  });
Answer 1

window.location.hash; как раз дает из ссылки то, что идет после клетки (включая клетку). Далее по этому же куску можно проверить - есть ли на странице такой элемент. Если .length вернет 0 == это false, не выполнится.

$(document).ready(function() {
  var id = window.location.hash;
  if( id.length > 1 && $(id).length ){ // просто $('#') даёт ошибку
    $('html, body').animate({
      scrollTop: $(id).offset().top
    }, 2000);
  }
});

Вообще, в любой непонятной ситуации, можно написать console.log( что-то там ) и посмотреть, какие у неё есть свойства:

console.log( window.location );

P.s. Если в коде есть куча else-if, значит скорее всего что-то идет не так) Можете еще познакомиться с массивами и объектами → https://learn.javascript.ru/ (весь 4-й пункт)

READ ALSO
Как узнать, какой элемент вызвал функцию?

Как узнать, какой элемент вызвал функцию?

К примеру есть два элемента <input type="range">, которые вызывают одну и туже функцию (с помощью oninput="")В зависимости от того, какой именно input вызвал...

114
Как отправить Post запрос на js без библиотек?

Как отправить Post запрос на js без библиотек?

Я хочу отправить сообщение от сообщества вкКак составить на js пост запрос аналогичный ссылке

120
Умный указатель сигнал-слот

Умный указатель сигнал-слот

Попробовал передать умный указатель std::unique_ptr через сигнал/слот и получил ошибку из за удаленного конструктора копирования (unique_ptr(const unique_ptr&)...

72