加载以name main。*。css和main。*。js开头的所有css和Js文件

Question

在我的index.html中，我想加载所有匹配特定模式的css和js文件。

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {...} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}

例如 - 所有匹配名称为main.abc.css，main.788.css和main.abc.js以及main.6788.js的文件

Answer 1

这不能直接实现。如您所见，href属性的值是一个字符串。浏览器会按原样读取整个字符串。

为了做到这一点，您必须处理如何打包JS / CSS文件。

选项1：您可以根据您想要使用的模式，使用像webpack这样的捆绑包将文件打包到单独的JS / CSS文件中。

选项2：使用服务器端脚本。您可以获取路径中的文件列表，迭代它们并包含您想要的文件。不建议这样做。仅包含您想要包含的文件

总是更安全