IE条件注释

IE10以下版本可用，IE11已经取消支持

<!--[if lte IE 8]> 	
        <script src="/js/html5.js"></script>
        <script src="/js/css3-mediaqueries.js"></script>
        <link href="/css/ie8.css" rel="stylesheet" type="text/css">
<![endif]-->

因为IE11不支持条件注释，可以使用正则判断

var browser = navigator.appName;
var ie11 = !!navigator.userAgent.match(/Trident\/7\./);
if (browser == 'Microsoft Internet Explorer' || ie11 == true) {
    //do something
}

IE9部分页面不显示的问题

IE9是不支持 console.log 打印输出语句的，在非开发者模式下会阻塞不会执行后面的内容

IE9 及以下 IE浏览器不支持placeholder属性

引入 jquery和用于解决这个属性兼容的CDN
<script type="text/javascript" src="http://www.ijquery.cn/js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="http://www.ijquery.cn/js/jquery.placeholder.min.js"></script>

<%--兼容IE9及以下input输入框，textarea文本框不支持提示文本placeholder属性的问题--%>
<script type="text/javascript">
    $(function(){ $('input, textarea').placeholder(); });
</script>

上面这种方法在HTML文件中亲测有效，但是不知道为什么在前后端不分离JSP项目中不会生效，以某国企老项目为例，需要在每个页面的JS代码中加上

	<!-- css代码 -->
    .phcolor{ 
			color:#999;
	}

    <!-- js代码 -->
	// placeholder兼容IE9
	$(function(){
	  //判断浏览器是否支持placeholder属性
	  supportPlaceholder='placeholder'in document.createElement('input'),
	  placeholder=function(input){
	    var text = input.attr('placeholder'),
	    defaultValue = input.defaultValue;
	    if(!defaultValue){
	      input.val(text).addClass("phcolor");
	    }
	    input.focus(function(){
	      if(input.val() == text){
	        $(this).val("");
	      }
	    });
	    input.blur(function(){
	      if(input.val() == ""){
	        $(this).val(text).addClass("phcolor");
	      }
	    });
	    //输入的字符不为灰色
	    input.keydown(function(){
	      $(this).removeClass("phcolor");
	    });
	  };
	  //当浏览器不支持placeholder属性时，调用placeholder函数
	  if(!supportPlaceholder){
	    $('input').each(function(){
	      text = $(this).attr("placeholder");
	      if($(this).attr("type") == "text"){
	        placeholder($(this));
	      }
	    });
	  }
	});

换行word-wrap与word-break兼容ie和火狐、chrome

  1. word-wrap控制换行，使用break-word时，会强制进行换行，中文没问题，英文语句没问题，长串的英文不会生效。
  2. word-break控制是否断词
    normal是默认情况，英文单词不被拆开
    break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。
    keep-all，是指Chinese, Japanese, and Korean不断词。即只用此时，不用word-wrap，中文就不会换行了。（英文语句正常。）
    所以，要做到英文和中文等强制换行，需要组合使用如下
<p style="word-wrap: break-word; word-break: break-all"></p>

JS判断移动端浏览器还是PC浏览器

window.parent.location.href = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent) ? "${context}/erpGuaranteeFlowController/findErpGuaranteeApprovalNew.do" :  "${context}/erpItosController/toDoList";


var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone",
            "SymbianOS", "Windows Phone",
            "iPad", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length; v++) {
    if (userAgentInfo.indexOf(Agents[v]) > 0) {
        flag = false;
        break;
    }
}

if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
	<!-- 移动端设备 -->
	h5flag = false
} else {
	<!-- pc端设备 -->
	h5flag = true
}