优化条件语句(PHP和JavaScript)

优化条件语句(PHP和JavaScript),php,javascript,stylesheet,conditional-statements,Php,Javascript,Stylesheet,Conditional Statements,我在我的网站上使用了两种我自己创造的条件语句。我使用这些语句来检测浏览器并输出不同的样式表。(我知道有更好、更复杂的方法可以做到这一点,但这不是重点。)正如您所看到的,MSIE 8、9、10等使用相同的样式表,但我不太确定如何对语句进行分组: <?php if (strStr(getEnv('HTTP_USER_AGENT'), 'Opera')) { echo '<link rel="stylesheet" href="http://www.example.com/nn_s

我在我的网站上使用了两种我自己创造的条件语句。我使用这些语句来检测浏览器并输出不同的样式表。(我知道有更好、更复杂的方法可以做到这一点,但这不是重点。)正如您所看到的,MSIE 8、9、10等使用相同的样式表,但我不太确定如何对语句进行分组:

<?php
if (strStr(getEnv('HTTP_USER_AGENT'), 'Opera')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/nn_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/op11_styles.css");</style>' . "\n"; 
} 
else if (strStr(getEnv('HTTP_USER_AGENT'), 'Gecko')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/nn_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ch_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 6.0')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/ie_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie6_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 7.0')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/ie7_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 8.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 9.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 10.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
?>
<!--[if IE 6]>
<link rel="stylesheet" href="http://www.example.com/ie_styles.css" type="text/css">
<style type="text/css">@import url("http://www.example.com/ie6_styles.css");</style>
<![endif]-->

这是同一脚本的JS版本:

var MSIE10=navigator.userAgent.indexOf("MSIE 10.0");
var MSIE9=navigator.userAgent.indexOf("MSIE 9.0");
var MSIE8=navigator.userAgent.indexOf("MSIE 8.0");
var MSIE7=navigator.userAgent.indexOf("MSIE 7.0");
var MSIE6=navigator.userAgent.indexOf("MSIE 6.0");
var NETS=navigator.userAgent.indexOf("Gecko");
var OPER=navigator.userAgent.indexOf("Opera");
if(OPER>-1) {
document.write('<link rel="stylesheet" href="http://www.example.com/op_styles.css" type="text/css">');
document.write('<style type="text/css">@import url("http://www.example.com/op11_styles.css");</style>');
}
else if(MSIE6>-1){
document.write('<link rel="stylesheet" href="http://www.example.com/ie_styles.css" type="text/css">');
document.write('<style type="text/css">@import url("http://www.example.com/ie6_styles.css");</style>');
}
else if(MSIE7>-1){
document.write('<link rel="stylesheet" href="http://www.example.com/ie7_styles.css" type="text/css">');
document.write('<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>');
}
else if(MSIE8>-1){
document.write('<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>');
document.write('<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>');
}
else if(MSIE9>-1){
document.write('<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>');
document.write('<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>');
}
else if(MSIE10>-1){
document.write('<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>');
document.write('<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>');
}
else {
document.write('<link rel="stylesheet" href="http://www.example.com/nn_styles.css" type="text/css">');
document.write('<style type="text/css">@import url("http://www.example.com/ch_styles.css");</style>');
}
var MSIE10=navigator.userAgent.indexOf(“MSIE 10.0”);
var MSIE9=navigator.userAgent.indexOf(“MSIE 9.0”);
var MSIE8=navigator.userAgent.indexOf(“MSIE 8.0”);
var MSIE7=navigator.userAgent.indexOf(“MSIE 7.0”);
var MSIE6=navigator.userAgent.indexOf(“MSIE 6.0”);
var NETS=navigator.userAgent.indexOf(“Gecko”);
var OPER=navigator.userAgent.indexOf(“Opera”);
如果(操作>-1){
文件。写(“”);
document.write('@import url('http://www.example.com/op11_styles.css");');
}
否则如果(MSIE6>-1){
文件。写(“”);
document.write('@import url('http://www.example.com/ie6_styles.css");');
}
否则如果(MSIE7>-1){
文件。写(“”);
document.write('@import url('http://www.example.com/ie7_9_styles.css");');
}
否则如果(MSIE8>-1){
document.write('@import url('http://www.example.com/ie7_styles.css");');
document.write('@import url('http://www.example.com/ie7_9_styles.css");');
}
否则如果(MSIE9>-1){
document.write('@import url('http://www.example.com/ie7_styles.css");');
document.write('@import url('http://www.example.com/ie7_9_styles.css");');
}
否则如果(MSIE10>-1){
document.write('@import url('http://www.example.com/ie7_styles.css");');
document.write('@import url('http://www.example.com/ie7_9_styles.css");');
}
否则{
文件。写(“”);
document.write('@import url('http://www.example.com/ch_styles.css");');
}
试试这个

if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 7.0') || strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 8.0') || strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 9.0')) 

更好地使用html条件语句:

<?php
if (strStr(getEnv('HTTP_USER_AGENT'), 'Opera')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/nn_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/op11_styles.css");</style>' . "\n"; 
} 
else if (strStr(getEnv('HTTP_USER_AGENT'), 'Gecko')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/nn_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ch_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 6.0')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/ie_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie6_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 7.0')) 
{ 
  echo '<link rel="stylesheet" href="http://www.example.com/ie7_styles.css" type="text/css" media="screen">' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 8.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 9.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
else if (strStr(getEnv('HTTP_USER_AGENT'), 'MSIE 10.0')) 
{ 
  echo '<style type="text/css">@import url("http://www.example.com/ie7_styles.css");</style>' . "\n" . '<style type="text/css">@import url("http://www.example.com/ie7_9_styles.css");</style>' . "\n"; 
}
?>
<!--[if IE 6]>
<link rel="stylesheet" href="http://www.example.com/ie_styles.css" type="text/css">
<style type="text/css">@import url("http://www.example.com/ie6_styles.css");</style>
<![endif]-->

对于JS部分,可以使用<代码>开关(TRUE),并检查各种情况作为case语句

回避代码组织问题,考虑在服务器上使用内置浏览器检测功能。


对于客户端,通常最好避免在JS中执行任何特定于浏览器的操作,而是使用一个框架(如jQuery)来隐藏这些差异。在这种情况下,似乎可以根据服务器的浏览器检测有条件地链接到正确的样式表。

如果确实需要每个浏览器的样式表,则可能需要查看HTML标记。但要回答你的问题,我会这样做。可能有一些错误,我没有测试它

PHP

$user_agents = array(
    'Opera' => 'nn',
    'Gecko' => 'nn',
    'MSIE 6.0' => 'ie'
);

$style_sheet = 'ie7'; // default
foreach ($user_agents as $agent => $sheet) {
    if (strStr(getEnv('HTTP_USER_AGENT'), $agent)) {
        $style_sheet = $sheet;
        break;
    }
}

echo '<link rel="stylesheet" href="http://www.example.com/'.$style_sheet.'_style.css" type="text/css" media="screen">';
$user\u agents=array(
“Opera”=>“nn”,
“壁虎”=>“nn”,
“MSIE 6.0”=>“ie”
);
$style_sheet='ie7';//违约
foreach($user\u代理作为$agent=>$sheet){
if(strStr(getEnv('HTTP\u USER\u AGENT'),$AGENT)){
$style_sheet=$sheet;
打破
}
}
回声';
Javascript

您的样式表应该有一个一致的命名约定,以使其更容易

var user_agents = ['MSIE 9.0', 'MSIE 6.0', 'MSIE', 'Gecko', 'Opera'],
    style_sheets = ['ie7_9', 'ie', 'ie7', 'nn', 'op'], // indexs correspond with user_agents array
    inserted = false;

user_agents.forEach(function(item, index) {
    if (!inserted && navigator.userAgent.indexOf(item) > -1) {
        document.write('<link rel="stylesheet" href="http://www.example.com/'+style_sheets[index]+'_styles.css" type="text/css">');
        document.write('<style type="text/css">@import url("http://www.example.com/'+style_sheets[index]+'_styles.css");</style>');
        inserted = true;
    }
});
var user_agents=['MSIE 9.0','MSIE 6.0','MSIE','Gecko','Opera'],
style_sheets=['ie7_9','ie','ie7','nn','op'],//索引对应于用户_代理数组
插入=假;
user\u agents.forEach(函数(项、索引){
如果(!inserted&&navigator.userAgent.indexOf(item)>-1){
文件。写(“”);
document.write('@import url('http://www.example.com/“+样式表[索引]+”样式表.css“;”;
插入=真;
}
});

听起来很棒!然而,我对JS知之甚少。你能简单地解释一下这些双管的工作原理吗?它像“或”?:)尝试在web中搜索像“&&”和“| |”这样的条件运算符,您会得到更好的想法。