65.9K
CodeProject 正在变化。 阅读更多。
Home

修复常见的 IE 问题：更新您的 docmode 以符合 Web 标准

Rey Bango
starIconstarIconemptyStarIconemptyStarIconemptyStarIcon

2.00/5 (1投票)

2012 年 3 月 15 日

CPOL

4分钟阅读

viewsIcon

20793

修复常见的 IE 问题：更新您的 docmode 以符合 Web 标准

文档兼容性定义了浏览器如何渲染您的网站。您告诉浏览器期望什么越具体，用户体验就越好。使用HTML5等Web标准时，首先通过显式声明HTML5文档类型。

此标记会在Internet Explorer 9和10中触发标准模式。它在Chrome和Firefox中也效果很好。四个步骤将使您的网站为许多浏览器和设备做好准备。

第一步：验证您的网站是否使用标准模式

检查您的网站当前是否处于标准模式。

  1. 在IE10平台预览版中打开该网站。
    • 注意：您也可以按照相同的步骤更新IE9的文档模式，而无需下载预览版。
  1. 按F12启动IE开发人员工具，或在工具菜单中找到它，如下图所示。

  • 注意：如果您不熟悉使用IE F12开发人员工具来调试您的网页，请阅读以下教程。
  1. 检查您的网站是否显示浏览器模式：IE10和文档模式：IE10标准，如下图所示。

  1. 如果您的网站处于浏览器模式：IE10且文档模式：IE10标准，那么您已经完成了！ 注意浏览器模式和文档模式是否与上述不同。一个常见的例子是浏览器模式=IE8且文档模式=兼容模式，这表明您的网站是为旧版本IE设计的，可能尚未准备好支持Web标准。

第二步：为Web标准实现文档模式

强制IE10标准模式以测试您的网站。

  1. 在您的网站HTML页面中插入<!DOCTYPE html>。
  1. 在浏览器中重新加载您的页面，并使用F12开发人员工具再次检查浏览器模式和文档模式。 如果未显示浏览器模式：IE10且文档模式：IE10标准，请继续以下步骤。

第三步：确定您的网站为何未处于标准模式

大多数问题都与支持旧版本IE有关。 首先确保您的基于标准的（standards-based）代码在IE9和10中得到渲染。 然后为旧版本IE保留您的非标准代码。

  1. 我的页面未处于浏览器模式：IE10
  1. 我的页面未处于文档模式=IE10
  • 可能原因：您的网站的文档类型无效或缺失。
    • 解决方案：检查是否有一个有效、格式良好的文档类型，例如
      <!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"   
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

在此处了解有关如何更新您的文档类型的更多信息。

第四步：解决更新文档模式时常见的IE问题

大多数问题都与支持旧版本IE有关。 首先确保您的基于标准的（standards-based）代码在IE9和10中得到渲染。 然后为旧版本IE保留您的非标准代码。

  • 可能原因：条件注释支持浏览器版本特定的功能。
    • 解决方案：检查是否存在运行非标准代码的条件注释。 这些通常用于支持旧版本IE的特定功能，以允许页面优雅降级。 检查是否存在类似以下的代码。
      <!--[if IE 8]>
<p>Welcome to Internet Explorer 8.</p>
<![endif]-->

      将其删除并重新加载您的页面。 继续测试。 在此处了解有关条件注释的更多信息。

  • 可能原因：用户代理嗅探支持浏览器版本特定的功能。
    • 解决方案：检查是否存在用户代理嗅探。 这些通常用于通过浏览器模式提供的用户代理字符串来专门定位浏览器。 检查是否存在类似以下的代码。
      • if (version = /MSIE (\d+\.\d+)/.exec(navigator.userAgent)) {
	isIE = true;
browserVersion = parseFloat(version[1]);
}

      首先，在可能的情况下使用Web标准实现功能检测。 在此处了解有关用户代理字符串的更多信息。IE10用户代理字符串位于此处。

我的页面未正确呈现的其他原因

  • 可能原因：您的网站可能正在使用不再支持的特定于浏览器的功能。 尽可能使用Web标准。
  • 可能原因：您的网站可能正在使用IE10 Metro版不再支持的第三方插件，如Flash、Quicktime和Silverlight。 尽可能使用Web标准。
    • 解决方案：了解如何创建无需插件的体验。 完整的步骤指南即将推出。
  • 可能原因：您的网站可能正在加载特定于浏览器版本的CSS文件。

IE兼容性手册中提供了一系列常见问题（http://msdn.microsoft.com/en-us/library/ff986083(v=VS.85).aspx)。

如果您无法通过这些解决方案步骤更新您的文档模式，请在Twitter上@IE联系我们，或查看MSDN上的论坛。

有关更多详细信息，请尝试阅读这些文章：

© . All rights reserved.