获取 Href 链接；如果要跳过 JPG

Question

我为我的网站创建了一个加载器（整个前端都是自定义的，所以现在我可以编辑大约 95% 的所有内容，除了 woocommerce 插件）。超级简单的一个，它遵循这个逻辑，如果锚是 # 或页面本身，它不会做任何事情（这是我想要的）但是生成我的图片库的 woocommerce 插件是一个不是页面本身的链接或一种 ＃。这意味着我需要收集扩展名的路径名，如果它结束jpg png或任何图像文件继续；并跳过动画的其余部分并允许插件运行它的课程。

我在 woocommerce 中使用了 Barba JS、SWUP 和其他动画，这是唯一一个不会中断或有这么多条件的 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');

  });

我加注了我需要更改的内容。动画有效，页面过渡有效。我需要动画来识别 a 标签是否以 an 结尾jpg或png跳过而不执行动画并将链接视为动画不存在。

Answer 1

从未使用过 woocommerce 所以我不完全了解用例，但您可以获得链接的文件扩展名，如下所示：&nbsp; &nbsp; for (var idx = 0; idx < anchors.length; idx += 1) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;let fileType = anchors[idx].href.split('.').pop();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;//Do whatever&nbsp; &nbsp; }或者，如果您想将其与预设的扩展列表进行比较，您可以使用正则表达式：&nbsp; &nbsp; for (var idx = 0; idx < anchors.length; idx += 1) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;if (anchors[idx].href.match(/\.(jpg|png)$/)) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;//Do whatever&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;}&nbsp; &nbsp; }