Question

到目前为止，我正在使用此JS加载不同的样式表（如果指定的浏览器）。但此刻，它对我不起作用。它不显示任何样式表。我找不到什么错。

<script type="text/javascript">
if ( $.browser.mozilla == true ) {
  document.write("<link type=\"text/css\" rel=\"stylesheet\" href=\"css\FF.css\">");
}
</script>
<script type="text/javascript">
if ( $.browser.chrome == true ) {
  document.write("<link type=\"text/css\" rel=\"stylesheet\" href=\"css\Chrome.css\">");
}
</script>

Answer 1

上面的评论是正确的，这不再是JQuery函数。

正如您所说，这是因为内容看起来不同，请尝试使用这些工具：

http://modernizr.com/ - 允许您根据哪些元素进行设计，而不是使用哪种浏览器
http://necolas.github.io/normalize.css/ - 将帮助标准化元素的默认样式
http://jigsaw.w3.org/css-validator/
http://validator.w3.org/ - 有效代码更有可能适用于所有浏览器。

如果做不到这一点，请在此处询问具体问题（理想情况下使用jsfiddle） - css很少能够在所有新浏览器上工作或者无法实现简单的解决方法。

另外：现在几乎不可能在所有浏览器中进行测试，因为有很多，所以知道一个脚本适用于你测试的所有内容应该让你相信它会对那些你没有测试过的人起作用。

Answer 2

此功能已在jQuery 1.9中删除：http://jquery.com/upgrade-guide/1.9/

在此页面上，建议使用此库来获取此功能：http://modernizr.com/

Answer 3

Chrome和Chrome版上测试的纯javascript版本Firefox浏览器。应该在Opera上工作。过去在你想要的页面上。

之前的底部更好

document.addEventListener("DOMContentLoaded",browsercss);

function browsercss() {
    navigator.sayswho = function () {
        var c = navigator.userAgent,
            b, a = c.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
        if (/trident/i.test(a[1])) return b = /\brv[ :]+(\d+)/g.exec(c) || [], "IE " + (b[1] || "");
        if ("Chrome" === a[1] && (b = c.match(/\bOPR\/(\d+)/), null != b)) return "Opera " + b[1];
        a = a[2] ? [a[1], a[2]] : [navigator.appName, navigator.appVersion, "-?"];
        null != (b = c.match(/version\/(\d+)/i)) && a.splice(1, 1, b[1]);
        return a.join(" ")
    }();
    var stylesheet = "";

    if (navigator.sayswho.indexOf('Chrome') >= 0) {
        stylesheet = 'http://example.com/chrome.css';
    }
    if (navigator.sayswho.indexOf('Mozilla') >= 0) {
        stylesheet = 'http://example.com/mozilla.css';
    }
    if (navigator.sayswho.indexOf('Opera') >= 0) {
        stylesheet = 'http://example.com/mozilla.css';
    }

    loadcss = document.createElement('link');
    loadcss.setAttribute("rel", "stylesheet");
    loadcss.setAttribute("type", "text/css");
    loadcss.setAttribute("href", stylesheet);

    document.getElementsByTagName("head")[0].appendChild(loadcss);
}

Answer 4

您可以使用JavaScript来检测和更改不同浏览器的CSS，但代码有点笨重。

使用链接

Different CSS files for Different Browsers

为不同的浏览器使用不同的StyleSheet？

4 个答案: