如何使用 jQuery 使用不同的 CSS？

【问题标题】：How can I use a different CSS using jQuery?如何使用 jQuery 使用不同的 CSS？
【发布时间】：2010-07-31 03:04:42
【问题描述】：

我正在设计我的网站的移动版本，但后来意识到我需要至少支持三种（iPhone、iPad 和 Android）。在那种情况下，我正在考虑使用 jQuery 来完成我首先检测它是什么设备然后加载适当的 CSS 的任务。我该怎么做呢？是这样的吗？这甚至是好方法还是有更好的方法来实现同样的目标？

<html>
<head>

<script type="text/javascript">
   //Detect device type using jQuery
   //Insert the proper stylesheet?

   //Rest of the javascript
</script>
</head>
<body>
...
</body>

【问题讨论】：

标签： javascript jquery iphone css android

【解决方案1】：

如果您不介意将所有 CSS 放入一个样式表中，您可以这样做：

将其放在 HTML 的 <head> 标记中：
<link id="ss" rel="stylesheet" type="text/css" href="norm.css" />

然后将其添加到您的 javascript 文件中。

var uagent = navigator.userAgent.toLowerCase();
if (uagent.search("iphone") > -1)
{
    $("#ss").attr("herf", "iphone.css");
}
if (uagent.search("ipad") > -1)
{
    $("#ss").attr("herf", "ipad.css");
}
if (uagent.search("andriod") > -1)
{
    $("#ss").attr("herf", "android.css");
}

【讨论】：