WordPress在Functions.php中使用JavaScript将CSS文件排队

我正在尝试在手机上加载CSS文件

我做了一些研究，发现最好的方法是使用JS，下面是我发现的代码：

$( document ).ready(function() {      
var isMobile = window.matchMedia("only screen and (max-width: 760px)");

if (isMobile.matches) {
    //Add your script that should run on mobile here
}
});

现在，我如何将下面的代码放入该代码中

wp_enqueue_style( 'custom-css', get_template_directory_uri() . '/responsive.css'    );

另外，如何将其包含在Functions.php文件中

我尝试了以下方法，但没有成功

?>
<script>
$( document ).ready(function() {      
var isMobile = window.matchMedia("only screen and (max-width: 760px)");

if (isMobile.matches) {

wp_enqueue_style( 'custom-css', get_template_directory_uri() . '/responsive.css'    );
    
}
});
</script>
<?php

？>
$（文档）.ready（函数（）{
var isMobile=window.matchMedia（“仅屏幕和（最大宽度：760px）”；
if（isMobile.matches）{
wp_enqueue_样式（'custom css'，get_template_directory_uri（）./responsive.css'）；
}
});
结合使用PHP和JavaScript是不可能的。PHP只在服务器上运行，JavaScript只在客户端运行（有些例外）

使用函数的最后一个参数设置由
wp\u enqueue\u样式
函数创建的
标记上的
媒体
属性。MDN对
media
属性作了如下说明：

还可以在媒体属性中提供媒体类型或查询；只有介质条件为真时，才会加载此资源

及

此属性指定链接资源应用于的媒体。其值必须是媒体类型/媒体查询。此属性在链接到外部样式表时非常有用-它允许用户代理为其运行的设备选择最适合的样式表


这意味着您可以在
media
属性中进行媒体查询。如果该媒体查询是匹配的，则将加载样式表



这将输出：


wp\u enqueue\u风格是一个在服务器上运行的php函数。我认为您应该重新考虑您的方法。您正在使用JS中的CSS媒体查询来使用PHP有条件地加载文件，为什么要跳过这么多障碍呢？只需将媒体查询添加到您的CSS文件中即可。@prieber确实，这是我在我的问题帖子上尝试的一种愚蠢的方法。只是一个想学东西的新手：）我想有一个单独的CSS文件只在手机上加载，我正在尝试优化我的网站速度，这就是我尝试这种方法的原因。但是不用担心，下面最好的答案就是我想要的。@user3152370如果你想优化，那么我建议你先移动，当屏幕变大时加载任何后续的CSS文件。对于某些人来说，移动数据仍然是一种商品，因此保存的每一字节数据都可能有利可图。