javascript - 如何根据屏幕尺寸加载 .js 文件？

Question

我们如何使用 WordPress 主题文件夹 (wp-content/themename/js/file.js) 中的媒体查询加载特定的 Javascript 文件

他只想在使用平板电脑或桌面浏览器时加载 grid.js。

Answer 1

您应该异步加载 grid.js:

function is_touch_device()
{
          
  return !!('ontouchstart' in window);
           
} 

function loadGridJs() 
{

  var scriptTag = document.createElement('script'); 
  scriptTag.src = "//wp-content/themename/js/grid.js"; 
  scriptTag.type = 'text/javascript'; 
  scriptTag.async = true;  
  var headTag = document.getElementsByTagName('head')[0];
  headTag.appendChild(scriptTag);

}

if (is_touch_device())
{

  loadGridJs();

} 

参见:

Javascript asynchron nachladen , Touchgeräte erkennen