javascript - PHP 动态 CSS ... 在 Javascript 中？

Question

因此，在其他人的帮助下，我设法在本地通过 PHP 正确执行并运行了这个程序，但是我在公司网络服务器上遇到了问题。

如何改用 javascript 来做同样的事情？

我知道这不是响应式移动设计，并且有更好的方法来实现它。

非常感谢您的帮助

<?php

    // MOBILE
    $blackberry = strpos($_SERVER['HTTP_USER_AGENT'],"BB10");
    $blackberry2 = strpos($_SERVER['HTTP_USER_AGENT'],"BlackBerry");
    $iphone = strpos($_SERVER['HTTP_USER_AGENT'],"iPhone");
    $ipad = strpos($_SERVER['HTTP_USER_AGENT'],"iPad");
    $chrome = strpos($_SERVER['HTTP_USER_AGENT'],"Chrome");
    $safari = strpos($_SERVER['HTTP_USER_AGENT'],"Safari");

    // REDIRECTS 
    // MOBILE
    if ($blackberry == true) 
    { 
    header('Location: style.css');
    }
    else if ($blackberry2 == true)
    {
    header('Location: bb7.css');
    }
    else if ($iphone == true) 
    { 
    header('Location: style.css');
    }
    else if ($ipad == true) 
    { 
    header('Location: ipad.css');
    }
    else if ($chrome == true) 
    { 
    header('Location: style.css');
    }
    else if ($safari == true) 
    { 
    header('Location: style.css');
    }
?>

Answer 1

你会想要使用 JS navigator.userAgent 方法

供引用:http://www.w3schools.com/jsref/prop_nav_useragent.asp

例如:

<script>

var css;

switch(navigator.userAgent) {
    case 'BB10' // Or whatever the actual UA string is
        css = 'bb7.css';
        break;
    case 'iPhone' // Or whatever the actual UA string is
        css = 'iphone.css';
        break;
    default
        css = 'style.css';
        break;
}

var cssLink = document.createElement('link');
cssLink.setAttribute('rel', 'stylesheet');
cssLink.setAttribute('href', css);
document.getElementsByTagName('head')[0].appendChild(cssLink);

</script>

如果可用，您还可以使用 jQuery 附加样式表。