Question

我正在尝试在我的jekyll网站中使用一些lerp有趣的东西（平滑滚动），但是在移动设备上效果不佳，因此我想只将脚本限制在桌面上。我通过这种方式通过前面的问题加入了script：

{% if layout.common-js %} 
  {% for js in layout.common-js %}

  <script src="{{ js | relative_url }}"></script>

  {% endfor %} 
{% endif %}

然后我将此放在最前面：

common-js:
  - "/assets/js/any-other-js.js" (including the smooth scroll one)
  - "/assets/js/main.js"

这将使我的某些页面无法平滑滚动。

我想知道是否有一种干净的方法来执行Jekyll方法下面的代码：

  <script>
   if (navigator.userAgent.match(/(iPad)|(iPhone)|(iPod)|(android)|(webOS)|(Opera Mini)|(IEMobile)/i)) {      
    INCLUDE ONLY THE <script> files I WANT FOR MOBILE
   } 
   else {
    INCLUDE ALL THE <script> files  
   }
  </script>

还是您建议将此脚本放到我所有布局的head中？

更新：我尝试了这段代码，但似乎没有用：

<script>
      const body = document.querySelector("body");
      const js = document.createElement("script");

      if (navigator.userAgent.match(
          /(iPad)|(iPhone)|(iPod)|(android)|(webOS)|(Opera Mini)|(IEMobile)/i)) {
        js.src = "/assets/js/main.js";
      } else {
        js.src = "/assets/js/smoothscroll.js";
        js.src = "/assets/js/main.js";
      }

      body.appendChild(js);
</script>

有没有在Jekyll中使用navigator.userAgent的干净方法？

0 个答案: