优化条件语句(PHP和JavaScript)
Optimizing conditional statements (PHP and JavaScript)
我一直在我的网站上使用两种我自己创建的条件语句。我使用这些语句来检测浏览器并输出不同的样式表。(我知道有更好、更复杂的方法来做到这一点,但这不是重点。)如您所见,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";
}
?>
这是同一脚本的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>');
}
避开代码组织问题,考虑使用服务器上内置的浏览器检测功能。代码解析用户代理字符串?
对于客户端,避免在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">';
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;
}
});
试试这个
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条件语句:
<!--[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]-->
将if替换为switch
switch (strtolower(getEnv('HTTP_USER_AGENT'))) {
case 'opera':
...
break;
}
对于JS部分,您可以使用switch (true)
并检查各种条件作为case语句
相关文章:
- AJAX Post的奇怪Javascript/PHP行为
- 带有输入参数的Javascript/PHP中的XMLHTTPrequests
- 用Javascript/PHP创建字典
- 如何记录用户'使用Javascript/PHP的语音
- fetch data from db using javascript & php
- onClick按钮不工作javascript/php/jquery mobile
- 通过Javascript(PHP循环)添加类
- Javascript php onclick
- Interfacing html, javascript, php and mysql
- Javascript/PHP Validation
- JavaScript/PHP 刷新取代了 HTML 元素类
- Cross-domain javascript <-> php
- 设置计时器并使用javascript/PHP进行检查
- Javascript/Php聊天-输入is'不能在一个文本框中工作
- AJAX (JavaScript / PHP), FormData not sending
- Javascript/PHP中的HTML转义/编码
- 我想在Iframe Javascript PHP的帮助下,将单个ajax上传器脚本转换为多个上传器
- javascript/php中的批量打印
- Javascript/PHP,使用文本文件作为数据库,并将内容组织到阵列表中
- JavaScript/PHP函数不会发布到其他页面