企业IT管理员IE11升级指南【7】—— Win7和Win8.1上的IE11功能对比

admin 管理员组

文章数量: 887021

企业IT管理员IE11升级指南 系列：

　　【1】—— Internet Explorer 11增强保护模式 (EPM) 介绍

　　【2】—— Internet Explorer 11 对Adobe Flash的支持

　　【3】—— IE11 新的GPO设置

　　【4】—— IE企业模式介绍

　　【5】—— 不跟踪(DNT)例外

　　【6】—— Internet Explorer 11面向IT专业人员的常见问题

　　【7】—— Win7和Win8.1上的IE11功能对比

Win7和Win8.1上的IE11功能对比

在 HTML5 视频、触摸支持、设备和屏幕方向 API、Windows 集成和性能方面，Windows 8.1 上的 Internet Explorer 11 与 Windows 7 上的 IE11 之间有许多不同。

设备方向事件

Internet Explorer 11 利用设备方向和移动事件、全屏模式编程控制，以及将屏幕锁定在特定方向的能力，让你能够更好地控制网站和应用的显示。

IE11 添加了对 DOM 事件的支持，DOM 事件提供了新兴的 W3C DeviceOrientation 事件规范中定义的有关设备的物理方向和移动的信息。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

若要了解详细信息，请参阅设备方向事件。

拖放触摸支持

Internet Explorer 11 引入了对基于触摸的 HTML5 拖放的本机支持。

向你的 Web 应用添加拖放功能为用户提供直观的方式来从一个位置向另一个位置移动或复制文件，或者直观地重排集合中的项目。就像 Internet Explorer 默认提供基本触摸支持一样，使用 HTML5 拖放的大多数现有站点应该“恰好能够”与“按下、按住，然后拖动”用户交互模式配合使用。虽然你会像预期的那样收到 UI 线程上的用户输入事件，但 IE 实际上是在单独的一个线程上处理通过 ghost 操作得到的拖动图像呈现和动画，以使你的站点尽可能处于响应性较好的状态。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

UX 模式

按下、按住，然后拖动

对于为 Web 内容提供服务的触摸设备，针对拖放的一种常用用户交互模式就是 “按下、按住，然后拖动”这个序列。在 IE11 中，这是具有 draggable 属性的元素的默认行为。很多站点具备“位于折叠位置以下”的内容，需要依靠垂直平移/滚动才能看到，采用新 Windows UI 的 Internet Explorer 提供了通过水平轻扫向后/向前导航功能。因此，基于触摸的拖放的“按下、按住，然后拖动”模式通常最适合与采用 IE11 的网站一起使用,而“横向滑动”模式是针对 Windows 应用商店应用的有效方法。

注意  对基于触摸的拖放操作的支持限于单个浏览器窗口。虽然不可能跨窗口拖动元素，但支持从 Windows “桌面”将文件对象拖动到桌面中的 IE11 窗口中。

横向滑动

很多 Windows 应用商店应用和某些网站使用平面导航系统，这种情况下用户在单个页面上平移和/或在站点相同层次结构级别上驻留的页面中导航。使用横向滑动交互模式，这些应用可以消除用户相对于拖动平移的意图，方法是仅允许使用 touch-action 属性在一个轴上平移：

CSS

touch-action: pan-x;

然后沿垂直轴响应 drag events 和 manipulation events：

为了改善横向滑动用户体验，IE11 和 Windows 应用商店应用在 touch-action 属性中引入了 cross-slide-x 和 cross-slide-y 值。这些值请求 IE（或 Windows 运行时，如果是 Windows 应用商店应用）响应在独立于 UI 的线程上使用横向滑动动画进行的某些用户交互。

此外，IE11 和 Windows 应用商店应用还提供了几个新的状态值，以供进一步微调 MSManipulationEvent 的处理：

效果批处理和笔划改进功能

IE11 和 Windows 8.1 的使用 JavaScript 的 Windows 应用商店应用利用 Windows 8.1 中的 Direct2D 升级来改善图形效果和笔划性能。

因为它们使用多种中间纹理，所以阴影和复合操作等 Canvas 效果、SVG 滤镜效果、CSS 边框阴影和文本阴影都 非常耗费资源。IE11 和利用 Windows 8.1 中对 DirectImage 批处理行为的更改来更有效地联合 Direct3D Draw 调用，将对设备状态的更改减到最少。此更改会提升 Canvas、SVG 和 CSS 效果的性能，并会通过降低所使用中间值的个数来提升内存。

笔划是游戏和应用中使用的常见模式，用于绘制细线或轮廓线。使用 JavaScript 的 IE11 和 Windows 应用商店应用使用新的笔划算法，极大地提升了 Canvas 和 SVG 中的笔划性能。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

加密的媒体扩展

IE11 引入了对 HTML5 加密媒体扩展 (EME) 的支持。 EME 扩展了 video 和 audio 元素，从而可以在不使用插件的情况下启用受数字版权管理 (DRM) 保护的内容。 EME 在使用 Windows 8.1 的 IE11 和使用 JavaScript 的 Windows 应用商店应用中受支持。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

以下是与 EME 一起使用的一些主要 API。

有关详细信息，请参阅 HTML5 音频和视频 API 参考。

F12 开发人员工具 UI 响应

http://msdn.microsoft/zh-cn/library/ie/dn255009%28v=vs.85%29.aspx

当 Windows 7 并非处于最新更新时，Windows 7 上的 IE11 可能会禁用 F12 工具中的 UI 响应工具。如果 UI 响应工具无法在 Windows 7 上安装的 IE11 中正常工作，请确保已经安装 Windows 更新中的所有可用更新。

高 DPI 支持

Internet Explorer 11 针对高 DPI 屏幕和小型平板电脑提供了增强的缩放功能，从而确保 Windows 8.1 设备上网站文本、触摸目标以及布局的一致性。 特别是，IE11 引入了以下高 DPI 改进。

要点  除了 devicePixelRatio 属性外，此处列出的功能在 Windows 7 上的 IE11 中不受支持。

支持 devicePixelRatio 属性

尽管自带有 deviceXDPI 和 deviceYDPI 属性的 Microsoft Internet Explorer 6 以来提供了设备分辨率（也可以通过自 Windows Internet Explorer 9 开始的“媒体查询 resolution”获取），“devicePixelRatio”属性已迅速成为 Web 上使用的 de-facto 标准。IE11 添加了对此属性的支持，提供物理设备像素与进行了 DPI 调整的逻辑 CSS 像素之间的比率。使用早期版本的 IE，必须执行以下公式才能获取此相同值：

window.devicePixelRatio = window.screen.deviceXDPI / window.screen.logicalXDPI

比例系数选择改善

IE11 已改进了用于确定最优比例系数的逻辑，合并了观看距离考虑事项、多种默认比例系数选择以及多种其他变量。

使用 IE11，采用新的 Windows UI 中的 Internet Explorer 和桌面版 Internet Explorer 对于较大范围的默认比例系数的支持相同。在跨不同的设备外形尺寸和屏幕分辨率以一致方式观看网站方面，OEM 和 Windows 8.1 客户有了更大的灵活性。

多个监视器支持

因为 Windows 8 使用单一 DPI 设置，所以，如果你使用具有不同 DPI 的多个监视器，就会在至少一台监视器上得到次优比例系数。IE11 添加了按监视器的缩放支持，这样当你在不同监视器之间拖动窗口时，Web 内容会自动缩放到正确的级别。这在从高 DPI 设备投影时特别有用，因为投影仪通常采用低 DPI 显示器。

统一的视觉缩放模型

Windows Internet Explorer 8 和 Internet Explorer 9 使用“布局缩放”模型处理所有缩放，该模型缩放除视区宽度之外的所有内容的大小，并使用内容的新的较大大小重新计算页面布局。Internet Explorer 10 添加了一种替代性的简单缩放模型，即“视觉缩放”，该模型仅缩放原始的 100% 布局（因而避免了页面的重新布局）。

使用 IE11，现在所有缩放都使用视觉缩放处理，使跨缩放方案（如缩放菜单、收缩缩放、键盘/鼠标快捷方式、贴靠视图、@-ms-viewport 和 msContentZoomFactor）的体验更简单，可预测性更强。

兼容性注意

如果你的网站仍在使用传统文档模式（特别是，针对 Internet Explorer 9 或更早版本的文档模式），则 Windows 8.1 上的 IE11 将使用自然文本指标来呈现你的站点，以避免常见于采用非 100% 缩放级别的传统文档模式的前端呈现中的常见故障（例如内核支持降级）。

如果希望退出此默认行为，则可以使用以下 HTTP 头或 <meta> 标记：

HTML

HTML

<meta http-equiv="X-UA-TextLayoutMetrics" content="gdi" />

有关详细信息，请参阅传统文档模式下的视觉缩放。

悬停触摸支持

Windows 8.1 上的 Internet Explorer 11 已通过“长按”用户交互模式内置对需要使用悬停的常用 UX 方案（例如悬停菜单）的触摸支持。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

鉴于鼠标或笔输入设备可以悬停在某个元素上而无需激活该元素，没有提供将光标悬停在页面元素上的触摸模拟。如果触摸某个元素（如下拉菜单的标题），则同时悬停元素（展开菜单）并激活该元素（导航至菜单标题链接），使其无法从下拉菜单选择其他选项。

从 Windows 8 的 Internet Explorer 10 开始，可以使用 aria-haspopup 属性来指示元素已隐藏悬停内容，以便第一次点击时 IE 模拟悬停，而不是激活链接。

对于 Windows 8.1 上的 IE11，触摸设备用户可以通过简单直观的手势区分悬停（长按）与单击（点击）。

在 Internet Explorer 10 中，“长按”手势会激活页面上下文菜单（“复制”、“打开链接”等），这会阻碍悬停菜单的可见性。现在，在 IE11 中，页面上下文菜单作为 Windows “应用栏”出现在页面底部。

从 Internet Explorer 10 开始，可以通过在元素上指定 aria-haspopup="false" 禁用任何指定元素的所有触摸悬停模拟功能（不管是通过“点击”还是“长按”）。

链接突出显示

在 IE11 中点击链接时，你会看到突出显示已改进，可以针对页面上的触摸定位的内容提供更快更准确的可视指示。现在，Windows 8.1 上的此体验与在 Windows Phone 8 上的该体验类似。在 IE11 中，链接突出显示：

• 同时应用于链接的文本和图像
• 仅应用于触控（在 Internet Explorer 10 中，链接突出显示还应用于鼠标）     
• 不影响页面上的 CSS

如果不愿意使用链接突出显示，则可以在页面上指定以下 meta 标记：

HTML

<meta name="msapplication-tap-highlight" content="no" />

这将在 Windows 8.1 上的 IE11 和 Windows Phone 8 上的 Internet Explorer 10 中都禁用触摸点击链接突出显示。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

媒体源扩展

IE11 通过 HTML5 媒体源扩展 (MSE) 引入了对 MPEG-DASH 媒体流的支持。MSE 扩展 video 和 audio 元素，你可以动态更改它们以在不使用插件的情况下获取媒体流。这样，你可以对自适应媒体流、实时流、拼接视频和视频进行编辑。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

你可以使用 MSE 构建自定义自适应流解决方案。 这种自适应流解决方案会根据网络带宽和 CPU 使用率寻找最佳比特率，从而提供最高质量的流体验。例如，如果网络带宽下降，你可以使用 MSE 以编程方式将视频流切换到较低的比特率。 这会降低图像质量，但可以保持视频无中断播放。

通过动态拼接视频，可以在媒体播放过程中插入广告。因此，不必事先在媒体文件中放入剪辑，而在播放过程中随时向媒体流中插入剪辑。

下面是一些重要的 MSE API：

有关详细信息，请参阅 HTML5 音频和视频 API 参考和构建简单的 MPEG-DASH 流式播放器。

电话号码格式识别

Internet Explorer 11 可自动将电话号码转换为可单击的链接。 此功能在你拥有 Skype 等可以处理电话号码的应用时有效。

本文从开发人员的角度介绍电话号码检测功能，包括用于启用此功能的 HTML 元素以及在必要时如何关闭此功能。

了解电话号码检测

当采用全新 Windows UI 的 Internet Explorer 遇到使用支持的 HTML 元素呈现的内容中所包含的电话号码时，会将电话号码转换为可单击的链接（无需修改 DOM 即可完成此转换）。 当用户单击该链接时，将调用注册到 "tel" URI 协议的应用。

注意  桌面版 Internet Explorer、托管 WebBrowser 控件的应用程序或适用于 Windows 7 的 IE11 不支持电话号码格式识别。

电话号码检测功能对下列内容模式起作用：

<element>425-882-8080</element>

425.<element>882</element>.8080

(425) 882-8080

有关更多示例和详细信息，请参阅电话号码检测的工作方式。

电话号码也为跨内联元素的一系列实体所识别。 这意味着 display 属性必须设置为 "inline"。

在前面显示的模式中，"<element>" 指下列 HTML 元素之一：

不过，存在一些例外。 当 contentEditable 属性设置为 "true" 时，将禁用电话号码格式识别。 通过组策略或用户首选项也可以禁用电话号码格式识别。

固定站点增强功能

Internet Explorer 11 中对固定站点的更改支持动态磁贴，使站点在固定这些磁贴或将其另存为收藏夹或者显示为常用站点时更有视觉吸引力。 动态磁贴可让客户与你的网站建立更密切的联系，并创建自定义的“开始”屏幕体验。

设置动态磁贴和通知

IE11 提供以下三种方式来定义固定站点的自定义动态磁贴和通知：

• 使用 HTML 指定固定网站元数据：

HTML

  <meta name="application-name" content=" Contoso" />
  <meta name="msapplication-TileColor" content=" #009900" />
  <meta name="msapplication-square70x70logo" content="images/smalltile.png" />
  <meta name="msapplication-square150x150logo" content="images/mediumtile.png" />
  <meta name="msapplication-wide310x150logo" content="images/widetile.png" />
  <meta name="msapplication-square310x310logo" content="images/largetile.png" />
  <meta name="msapplication-notification" content="frequency=30; polling-uri=notifications/contoso1.xml; polling-uri2=notifications/contoso2.xml; polling-uri3=notifications/contoso3.xml" />

• 使用 JavaScript 设置定期通知：

JavaScript

document.addEventListener('mssitepinned', StartPeriodicUpdateBatch, false);
 
  function StartPeriodicUpdateBatch()
  {
      var arrURI = ["notifications/contoso1.xml", "notifications/contoso2.xml", "notifications/contoso3.xml"];
      window.external.msEnableTileNotificationQueue(true);
      window.external.msStartPeriodicTileUpdateBatch(arrURI);

}

• 使用 XML  浏览器配置文件，然后从网页的标记中调用这些文件：

XML

<?xml version="1.0" encoding="utf-8"?>
<browserconfig>
  <msapplication>
    <tile>
      <square70x70logo src="images/smalltile.png"/>
      <square150x150logo src="images/mediumtile.png"/>
      <wide310x150logo src="images/widetile.png"/>
      <square310x310logo src="images/largetile.png"/>
      <TileColor>#009900</TileColor>
    </tile>
    <notification>
      <polling-uri  src="notifications/contoso1.xml"/>
      <polling-uri2 src="notifications/contoso2.xml"/>
      <polling-uri3 src="notifications/contoso3.xml"/>
      <frequency>30</frequency>
      <cycle>1</cycle>
    </notification>
  </msapplication>
</browserconfig>

使用 meta 元素加载浏览器配置文件：

HTML

<meta name="msapplication-config" content="IEconfig.xml" />

若要取消浏览器配置文件，请将 meta 元素的 content 属性设置为“无”""。

有关详细信息，请参阅：

• 在 IE11 中为你的网站创建动态磁贴     
• 交互在线示例
• 可下载的示例
• IE11 Test Drive 演示

动态磁贴和通知的新增功能

IE11 添加了元数据值，使你可以将站点固定到 Windows“开始”屏幕：

注意  磁贴图像的大小必须小于 200 KB，并且不超过 1024x1024 像素。

有关固定网站元数据的详细信息，请参阅：

• 声明固定网站元数据
• 固定网站元数据参考

此外，IE11 提供了新的方法、函数和事件来支持通知：

固定网站功能更改

从 IE11 开始，不再支持以下固定站点功能，或者已通过需要更改代码的方式修改了这些功能：

• msapplication-TileImage。为了实现最佳效果，请使用 msapplication-square150x150logo。
• Site mode，在 Internet Explorer 8 中引入。 若要确定某固定网站是否从 Windows“开始”屏幕启动，请改用 msPinnedSiteState。
• 只有桌面版的 Internet Explorer 才支持跳转列表。 这会影响以下 API：
• msapplication-tooltip 元数据名称值。 更改后，现在使用 application-name 作为动态磁贴的描述。

• • msSiteModeAddJumpListItem      
  • msSiteModeClearJumpList      
  • msSiteModeCreateJumpList      
  • msSiteModeShowJumpList      
  • msapplication-task
  • onmssitemodejumplistitemremoved      
  • msapplication-starturl      

使用这些功能更新任意固定网站。

屏幕方向 API

使用 IE11 中介绍的 W3C 屏幕方向 API，你可以检测屏幕的当前方向，在方向改变时得到通知，并能够将方向锁定到特定状态。

此功能在 Windows 7 上的 IE11 中不受支持。

有关详细信息，请参阅屏幕方向 API。

使用触摸和其他输入方式滚动和缩放

Windows 8.1 上的 Internet Explorer 11 建立于通过以下方法对滚动和缩放进行微调控制：通过添加对其他输入类型（如触摸板、鼠标以及键盘）的支持在 Windows 8 上的 Internet Explorer 10 和 Windows 应用商店应用中引入触摸以及通过达到滚动和缩放动画效果的新方法。.

要点  此功能在 Windows 7 上的 IE11 中不受支持。

此功能由 Windows 直接操作 API 提供，但通过一系列 CSS 属性和 DOM 属性与方法（如 msContentZoomFactor 和 msZoomTo）对你的网页和应用公开。使用“直接操作”，系统会处理触摸输入并在委托线程中提供内置交互反馈动画，从而释放 UI 线程以响应 Web 应用的脚本和脚本驱动的动画。

msZoomTo 方法

新的 msZoomTo 方法使用动画滚动和/或缩放元素至其指定的坐标。它提供了简单的高性能方法来在网站中和使用 JavaScript 的 Windows 应用商店应用中实现动画滚动导航并取得系统性缩放效果。 在使用 JavaScript 的 Windows 应用商店应用中，此方法用于 FlipView 控制、“应用栏”和分页方案。

例如，可以使用 msZoomTo 放大元素，同时保持其在视区中居中：

JavaScript

var args = {
    contentX: target.offsetLeft + target.offsetWidth/2;
    contentY: target.offsetTop + target.offsetHeight/2;
    scaleFactor: 2.0;
}
zoomer.msZoomTo(args);

对在输入设备上滚动、平移和缩放进行微调

IE11 支持对 CSS 和 DOM 属性使用更多输入类型来微调在 Windows 8 上的 Internet Explorer 10 中引入的通过触摸滚动和缩放。特别是，已为 IE11 添加以下支持：

• 鼠标、键盘以及触摸板的滚动/平移吸附点支持
• 滚动轨道并缩放链接、限制以及触摸板交互的吸附点支持

如果你已经在使用这些属性，则 IE11 中添加的这项支持应该无需对现有代码进行任何更改即可正常起作用。

跨设备同步

使用 Windows 8.1 上的 IE11 中的同步选项卡和用户设置可使你的用户跨其设备无缝查看你的站点并与之交互。Windows 8.1 上的 IE11 的新增同步功能是以设备切换为指导思想设计的。当用户离开某个设备时，所有打开的选项卡（InPrivate 浏览选项卡除外）都使用 Microsoft OneDrive 服务器进行同步，因此用户在另一设备上打开 IE 时，可以随时使用这些选项卡。

注意  像 Windows 上使用该同步平台的其他应用一样，OneDrive 中的同步 IE 数据对用户也不可见。用户能够在 IE 中看到自己的同步数据。

同步的选项卡在采用 Windows UI 的 Internet Explorer 和桌面版 Internet Explorer 中都有入口点。

在 IE11 中同步其他设置和用户首选项时，不必在新设备上配置 IE11。默认情况下会同步用户配置的设置和首选项。

此表显示了 Windows 8.1 上的 IE11 中的同步功能相对于 Windows 8 上的 Internet Explorer 10 的改进：

要点  此功能在 Windows 7 上的 IE11 中不受支持。

TCP 连接共享 (SPDY)

IE11 支持 SPDY/3，它是一种协议，用于定义如何将多个 HTTP 请求多路复用（合并）到一个 TCP 连接。 由此便可以通过减少请求网页时所需的单独 TCP 连接数量来提高性能。

有关详细信息，请参阅 SPDY 协议规范，第 3 稿。

要点  此功能在 Windows 7 上的 IE11 中不受支持。

本文标签： 管理员 功能 指南 企业