Получить Href Link;если JPG пропустить

Question

Я создал загрузчик для своего веб-сайта (весь пользовательский интерфейс настраивается, поэтому на данный момент я могу редактировать около 95% всего, что у меня есть, кроме плагина woocommerce).Очень простой, он следует этой логике: если якорь является # или самой страницей, он ничего не будет делать (что я и хотел), но плагин woocommerce для генерации моей галереи изображений - это ссылка, которая не является самой страницей или #,Что означает, что мне нужно собрать путь к расширению, если оно заканчивается на jpg png или любом файле изображения, чтобы продолжить;и пропустите оставшуюся часть анимации и дайте плагину работать.

Я использую Barba JS, SWUP и другие анимации с woocommerce, и это единственная программа, которая не прерывает или имеет так много условий с woocommerce.,

function fadeInPage() {
    if (!window.AnimationEvent) { return; }
    var fader = document.getElementById('fader');
    fader.classList.add('fade-out');
  }

  document.addEventListener('DOMContentLoaded', function() {
    if (!window.AnimationEvent) { return }

    var anchors = document.getElementsByTagName('a'); 


******* for (var idx = 0; idx < anchors.length; idx += 1) {
      if (anchors[idx].hostname !== window.location.hostname || anchors[idx].pathname === window.location.pathname) *******

{

        continue;
      }
      anchors[idx].addEventListener('click', function(event) {

        var fader = document.getElementById('fader'),
            anchor = event.currentTarget;

        var listener = function() {



          window.location = anchor.href;
          fader.removeEventListener('animationend', listener);
        };
        fader.addEventListener('animationend', listener);

        event.preventDefault();
        fader.classList.add('fade-in');
      });
    }
  });

  window.addEventListener('pageshow', function (event) {
    if (!event.persisted) {
      return;
    }
    var fader = document.getElementById('fader');
    fader.classList.remove('fade-in');
  });

Я поменял то, что мне нужно, изменилось.анимация работает, переход страницы работает.Мне нужна анимация, чтобы распознать, заканчивается ли тег jpg или png, чтобы пропустить, а не выполнять анимацию и обрабатывать ссылку, как если бы анимация отсутствовала.

Answer 1

Никогда не пользовался woocommerce, поэтому я не совсем понимаю вариант использования, но вы можете получить расширение файла для ссылки, например, так:

    for (var idx = 0; idx < anchors.length; idx += 1) {
           let fileType = anchors[idx].href.split('.').pop();
           //Do whatever
    }

Или, если вы хотите сравнить ее со списком предустановокиз расширений вы можете использовать регулярное выражение:

    for (var idx = 0; idx < anchors.length; idx += 1) {
           if (anchors[idx].href.match(/\.(jpg|png)$/)) {
               //Do whatever
             }
    }