【一天一道兼容性】之——IE6、7、8中的空格、折行

demo1:

<p id="p"> 123</p> <!--1之前有个半角空格-->
<script>
     var p = document.getElementById("p");
     alert(p.innerHTML.length)  //IE6、7、8弹出3，忽略了空格     标准浏览器弹出4 没有忽略空格
</script>

解析1：

alert(p.innerHTML.charAt(0) == "\u0020")  //IE6、7、8的charAt(0)为1     标准浏览器的charAt(0)为"\u0020" 

demo2:

<p id="p">
        123</p>     <!--1之前添加一个回车-->
<script>
     var p = document.getElementById("p");
     alert(p.innerHTML.length)  //IE6、7、8依然是3   标准浏览器：12
</script>

解析2：

alert(p.innerHTML.charAt(0)=="\u0020") //标准浏览器:false
alert(p.innerHTML.charAt(0)=="\n")     //标准浏览器:true
alert(p.innerHTML.charAt(1)=="\u0020") //标准浏览器:true
                         .                         true
                         .                         true
                         .                         true
alert(p.innerHTML.charAt(8)=="\u0020") //标准浏览器:true            

demo3:

<p id="p">
        123   <!--前后两次回车-->
</p>
<script>
     var p = document.getElementById("p");
     alert(p.innerHTML.length) //IE6、7、8弹出4   标准浏览器：17
</script>

解析3：

alert(p.innerHTML.charAt(3)=="\n")       //IE6、7、8：false
alert(p.innerHTML.charAt(3)=="\r")       //IE6、7、8：false
alert(p.innerHTML.charAt(3)=="\u3000")   //IE6、7、8：false
alert(p.innerHTML.charAt(3)=="\u0020")   //IE6、7、8：true

总结：不同编辑器，不同的模板会产生不同的折行或者空格，所以用childNodes会比较麻烦

建议解决方法：

p.innerHTML.replace(/\n+|\r+|\u0020\|\u3000/g,"");