HTML DOM节点在各浏览器中的识别差异
作者:飘零雾雨 日期:2008-05-19
JavaScript学习中，同学们若在我的学习笔记中发现错误，请麻烦告知于我，谢谢！
在IE浏览器及其它浏览器下对于HTML DOM的识别并非任何情况下都是一致的，主要是IE和非IE两个阵营的表现异同。
如有以下这样一段代码：
<div id="test">
<p>文字</p>
<p>文字</p>
<p>文字</p>
</div>
单从HTML结构表象来看，ID test 一共有3个P元素子节点。其实，在IE下，这种表象就是实质，而在非IE下，表象的外衣将顷刻被撕开。
为了看出这种区别，我们可以遍历test的子节点，并将其节点个数及节点类型都打印出来：
<script type="text/javascript">
var x = document.getElementById("test");
var xc = x.childNodes;
var xcl = xc.length;
for(var i=0;i<xcl;i++){
document.write("nodeName = " + xc[i].nodeName + "; nodeType = " + xc[i].nodeType + "<br />");
</script>
IE的打印结果为：
nodeName = P; nodeType = 1
nodeName = P; nodeType = 1
nodeName = P; nodeType = 1
非IE的打印结果为：
nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3
nodeName = P; nodeType = 1
nodeName = #text; nodeType = 3
避免和清除宽自适应布局在ie中产生几像素差异的方法
作者:飘零雾雨 日期:2007-07-24
标题想了半天也想不到一个好的，感觉怎么写怎么长!- -怕是小学时缩句没学好。
今天想说的这个问题应该算是老调重谈了，不过写出来希望会给大家一些帮助，也使我自己不会忘记，毕竟好记性比不上烂笔头。
相信做过宽度自适应布局的同学都碰到过在ie下莫名其妙的多出几像素的问题，我也觉得ie总是让人不断的折腾，可能是怕我们老坐在电脑前不“运动”会滋生出些什么乱七八糟的毛病来：）
先写个在不考虑ie情况下的宽自适应的两栏布局：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="Author" content="飘零雾雨|edzmaster@gmail.com" />
<title>关于自适应宽度布局在IE中的几像素异常</title>
<style type="text/css">
html,body {
margin:0;
}
#dyhead {
margin-bottom:5px;
}
#dyhead,#dyfoot {
background:#999;
}
#dyleft {
float:left;
width:400px;
height:100px;
background: #666;
}
#dyright {
height:100px;
margin-left:400px;
background: #ccc;
}
#dyfoot {
clear:both;
margin-top:5px;
}
</style>
</head>
<body>
<div id="dyhead">Head</div>
<div id="dyleft">左固定</div>
<div id="dyright">右自适应</div>
<div id="dyfoot">Foot</div>
</body>
</html>
