Javascript LESS.CSS和CSS文件替换为动态JS问题

我有以下问题-我正在使用一个简单的JS代码动态替换CSS文件，具体取决于浏览器窗口的大小。看起来是这样的：

<script type="text/javascript">
//<![CDATA[
<!--
function adjustStyle(width) {
    width = parseInt(width);
    if (width < 701) {
        $("#size-stylesheet").attr("href", "narrow.css");
    } else if ((width >= 701) && (width < 1120)) {
        $("#size-stylesheet").attr("href", "medium.css");
    } else {
       $("#size-stylesheet").attr("href", "wide.css"); 
    }
}

$(function() {
    adjustStyle($(this).width());
    $(window).resize(function() {
        adjustStyle($(this).width());
    });
});

-->
//]]>
</script>

//
//]]>

---

然而，除此之外，我还使用了LESS.CSS（）。好吧，这两个不能很好地协同工作——据我所知，CSS嵌入到HTML文档本身中的次数较少，因此CSS文件不会被替换。有什么办法使它起作用吗？或许

---

一个更好的方法？

你不能直接使用媒体查询吗

<link rel='stylesheet' media='screen and (max-width: 701px)' href='narrow.css' />
<link rel='stylesheet' media='screen and (min-width: 701px) and (max-width: 1120px)' href='medium.css' />
<link rel='stylesheet' media='screen and (min-width: 1120px)' href='wide.css' />

“据我所知，CSS被嵌入到HTML文档本身中的次数较少”不正确。更简单的是编译成简单的CSS。在服务器端进行生产，你就是黄金。只需链接到.less文件，让您的服务器做好编译（和缓存）工作，我正在考虑。我决定改用jQuery，因为浏览器的兼容性——IE9以下的版本不支持媒体查询？谢谢，这非常有帮助。解决了我的问题。