IE8访问ASPX.NET中嵌套JavaScript的问题

这些天在用ASPX为后台的一个Service做Web上的工具。 其中用到这样一段代码：

  var x='<div style="overflow: hidden; position: absolute; background-color: #ff0000; left: 12; top: 112; width: 4; height: 1"></div>';
  var d=document.getElementById("myCanvas");
  d.insertAdjacentHTML("BeforeEnd",x);
  alert(d.innerHTML);

 

用意很明显，就是希望在Div中加入一个子div，并设置它的位置和颜色。但是当用IE8访问的时候，alert的结果却出乎意料的抹去了left, top, width, height。而IE6工作正常。

 

更进一步，我发现，如果这段代码不在ASPX中，而只是在HTML中，IE8和IE6都工作正常。

仔细观察发现，在left的后面数字12没有单位。改成如下的代码，我看到了期望的结果。

var x='<DIV style="POSITION: absolute; BACKGROUND-COLOR: #ff0000; WIDTH: 4px; HEIGHT: 1px; OVERFLOW: hidden; TOP: 112px; LEFT: 12px"></DIV>';

总结观察的结论，我发现：

1. 包含片段1的HTML在IE6和IE8上工作正常；

2. 包含片段1的ASPX在IE6上正常，IE8上不正常；

可以推断，CLS在编译ASPX的时候，会针对不同的浏览器作不同的动作。我将在后续文章中进一步研究。