Javascript获取数据，但IE无法正确显示数据

我不确定原因或者如何解释清楚，但我的web UI在firefox和crome中都很棒

我使用httprequest动态获取数据并在UI中显示信息，但只有IE无法正确显示数据

我使用一个块根据返回的数据更改innerHTML，UI是

和

。 我的街区是这样的：

<ul id="roomlist" class="room_menu">
    <li id="allroom" class="txtunderline" style="text-align: right;">All Room</li>
</ul>

然后添加每li个房间，但IE（我尝试了IE8、IE10）只显示allroom和createroom，其他房间没有显示。我想这可能是因为其他

是使用如下图像定制的：

var oldRoom="<li id=\"room"+index+"\">";
oldRoom+="<table style=\"width: 100%; position: relative; top: -2px; left: -2px;\"><tr><td><img width=\"28px\" height=\"28px\" src=\"images/location/" + locatImg[index] + "\" /></td><td align=\"right\">" + locatInfo[index]+"</td></tr></table></li>";
$("#createroom").before(oldRoom);

我听说jQuery在2.0版发布后不兼容，但我的版本似乎不是2.0版

其他页面中的同类列表（

对）显示良好，并且没有图像添加到列表中

我绞尽脑汁，希望有人能帮我找出真正的问题，任何帮助都会感激

编辑：抱歉，我尝试简化列表，只显示如下文本：

var oldRoom="<li id=\"room"+index+"\">" + locatInfo[index] + "</li>";
$("#createroom").before(oldRoom);

var oldRoom=“
“+位置信息[索引]+”
”；
$（“#createroom”）。之前（oldRoom）；

在IE中，它仍然是一样的：


在crome中，结构是：
尝试重新设计代码，减少内联CSS的使用，并删除表格。您的方法非常分散，可能会遇到风格冲突或其他问题。例如，
position
样式可能是问题的根源，但很难知道，因为您的标记不是很有语义

需要注意的是，您可能遗漏了很多额外的房间信息，这将使这成为一个表格信息列表

如果只显示带有图标的房间，只需使用所需的背景图像创建一系列CSS类，然后将正确的类分配给

例如，您的CSS可以包括：

ul#roomList, ul#roomList li {
  padding: 0;
  margin: 0;
  list-style: none;
}

ul#roomList li {
  width: 10em;
  height: 28px;
  text-align: right;
  text-decoration: underline;
  background-color: #A0A0A0;
}

ul#roomList li.roomType1 {
  background-image: url('/images/room1.png');
}

ul#roomList li.roomType2 {
  background-image: url('/images/room3.png');
}

ul#roomList li.roomType3 {
  background-image: url('/images/room3.png');
}

在HTML中，您只需使用：

<ul id="roomList">
  <li class="roomType3">Some text for room 3</li>
  <li class="roomType1">Some text for room 1</li>
</ul>


房间3的一些文本
房间1的一些文本


但是，如果确实希望显示表格数据，则不应使用无序列表。相反，您应该只使用一个表，然后根据需要追加行（
）。只需确保不要将“所有房间”和“创建房间”功能按钮放入表中，因为它们不是表格数据

当你试图在搜索引擎上为你的酒店做广告时，这一点变得非常重要。适当的语义布局更容易让搜索引擎进行分析和广告。
好的，我发现当我想更改列表的innerHTML时，IE中的httprequest太慢，无法获取数据。这是我的错，我想我应该确保在更改UI之前收到数据。
为了回复，我简化了我的列表（
），但在IE中仍然无法正确显示。。。或者是IE获取数据太慢，因此无法显示数据（因为IE中的数组为空）的问题？在IE中使用
时有什么需要注意的吗？您可能应该考虑使用$.ajax（）进行调用，并将列表构建代码放入success（）调用中，该调用在ajax成功返回时运行。
ul#roomList, ul#roomList li {
  padding: 0;
  margin: 0;
  list-style: none;
}

ul#roomList li {
  width: 10em;
  height: 28px;
  text-align: right;
  text-decoration: underline;
  background-color: #A0A0A0;
}

ul#roomList li.roomType1 {
  background-image: url('/images/room1.png');
}

ul#roomList li.roomType2 {
  background-image: url('/images/room3.png');
}

ul#roomList li.roomType3 {
  background-image: url('/images/room3.png');
}

<ul id="roomList">
  <li class="roomType3">Some text for room 3</li>
  <li class="roomType1">Some text for room 1</li>
</ul>