模拟浏览器、屏幕大小和 GPS 位置

来源:互联网 发布:宝德网络江西分公司 编辑:程序博客网 时间:2024/05/17 07:35

试用模拟工具测试网页与其他不同文档模式、用户代理、屏幕大小和分辨率以及 GPS 位置坐标兼容的方式。

及早测试并经常测试

设计和开发现代 Web 意味着构建可在广泛设备和平台上工作的网页。通过使用 F12 开发人员工具中的模拟工具,可以模拟可在其中查看网页的不同环境。此操作使在开发循环中及早捕获和调试问题更加容易。

该工具分为三个部分,即模式、显示和地理位置:

F12 模拟工具

  • 模式:测试文档模式、对比桌面和 Windows Phone 浏览器配置文件,然后使用用户代理字符串模拟调试由浏览器窃听导致的错误。
  • 显示:模拟不同的屏幕大小和分辨率以查看网页的呈现方式。
  • 地理位置:模拟 GPS 接收器并输入 GPS 坐标以在网页中测试位置感知功能。

模式

文档模式

Internet Explorer 11 中的 F12 工具已将早期版本中的浏览器和文档模式的复杂矩阵简化为单个选项:文档模式。

可以使用以下六个选项:前沿(默认)表示 IE11 支持的所有最新标准和功能。其他五个选项表示 Internet Explorer 版本 5(a.k.a.“Quirks”)7、8、9 和 10。选择某个版本(IE11 除外)时,IE11 将呈现网页,就像你在使用该版本浏览器一样。它甚至可以更改浏览器发送的默认用户代理字符串。你可以使用“模式”部分中的“用户代理字符串”菜单手动设置不同的字符串。

值得注意的是,“文档模式”是较旧浏览器的模拟。它非常有用,但是如果你需要精确像素布局或者要确保你的页面在较旧版本的 IE 中以特定方式显示和工作,建议转至 Modern.ie 并下载具有较旧版本 IE 的虚拟计算机。虚拟计算机与适用于 Windows、Mac 和 Linux 的虚拟环境兼容,因此你可以获取用于在较旧版本的 IE 和 Windows 中进行测试和调试的最精确和最值得信赖的平台。

Windows 8.1 更新中有一项新增功能:当“文档模式”已从默认设置更改时,它会显示原因。下面是包含解释的简要原因列表:

  • “通过 F12 开发人员工具栏”:你已使用“文档模式”下拉列表对“文档模式”进行了更改。
  • “通过 X-UA-Compatible 元标记”:网页开发人员已使用元标记指定传统的文档模式。
  • “通过 X-UA-Compatible HTTP 标头”:Web 服务器已通过 HTTP 标头请求了传统的文档模式。
  • “通过本地兼容性视图设置”:已将该网站手动添加到兼容性视图设置。
  • “通过兼容性视图列表”:该网站位于 Microsoft 的兼容性视图列表上。
  • “通过 Intranet 兼容性设置”:在兼容性视图设置中选中了“在兼容性视图中显示 Intranet 网站”框。

浏览器配置文件

如果你要查看你的网页在 Windows Phone 8 设备上的执行方式,浏览器配置文件可帮助你更改各种设置以快速轻松地模拟 Windows Phone 8 设备,然后非常轻松地更改回默认桌面配置文件。

“企业”已添加为浏览器配置文件选项,这是 Windows 8.1 更新中的新增功能。 仅向 Windows 8.1 更新的企业版用户显示此选项,且仅在访问 IT 管理员指定的网页时显示。选中此选项时,IE11 的行为将类似于 Windows Internet Explorer 8。

有关详细信息,请参阅企业模式。

用户代理字符串

更改你的用户代理字符串是调试错误(仅在 IE 中出现,而不在其他浏览器中出现)良好的第一步。基本方式是使 IE 将其自身识别为其他版本,甚至是其他浏览器。

有时,前端和/或后端脚本会尝试检测你正在使用哪种浏览器。即使你未在自己的代码中使用任何浏览器检测,你也可能使用了可检测的第三方 JavaScript 库或服务器端脚本。

浏览器检测问题是它经常用于缩小比例或根据编写脚本的开发人员认为浏览器可以执行的操作(而不是使用功能检测检测浏览器实际可以执行的操作)来更改网页中的功能。此操作会导致意外行为,因为针对 Microsoft Internet Explorer 6 的代码在 IE11 中的运行方式不同,或者浏览器完全支持的功能因开发人员提出的假设而被禁用。

如果更改你的用户代理字符串可以清除问题,则浏览器检测可能是导致此问题的原因。

企业模式

从 Windows 8.1 更新开始,企业模式将添加到 IE11。

IT 管理人员可使用“组策略”设置为特定域或页面启用企业模式。它很像兼容性视图设置,不过它提供 Internet Explorer 8 兼容性。在 Internet Explorer 8 中运行的网页可在企业模式中无缝运行。

当在企业模式中显示某个页面时,IE11 将显示地址栏旁边的企业模式图标 企业模式图标

若要在网页上关闭企业模式,请将模拟工具的“配置文件”下拉菜单更改为“桌面”选项,或在“工具”菜单中切换“企业模式”选项。

默认情况下,企业模式中的 IE11 会为服务器提供 Internet Explorer 8 用户代理字符串。

有关配置组策略或注册表值以为特定网页或域启用企业模式的详细信息,请参阅企业模式的 IT 专业人员文档。

显示

显示模拟可帮助开发人员使用不同的屏幕大小和不同分辨率预览网页。它有助于识别网页从传统的桌面显示器过渡到较小的移动屏幕或较新的高分辨率显示屏时出现的问题。

要点  模拟经过调整以试用和匹配模拟屏幕的物理尺寸。模拟像素可以显示已压缩或已扩展,如果你需要测试 HTML 元素的完美像素定位,则不建议模拟。但是,模拟对测试响应式设计和识别较大元素定位问题十分有用。

方向

可用标准选项如下:

  • 纵向:屏幕高度大于宽度。这是适用于大多数移动设备屏幕的方向。
  • 横向:屏幕宽度大于高度。这是适用于大多数笔记本电脑屏幕和桌面显示器的方向。

分辨率

 分辨率模拟选项下拉列表

提供一系列物理尺寸和分辨率。如果以上内容都不能满足你的需要,则可以通过从菜单中选择“自定义”设置自定义大小和分辨率。

支持的自定义大小最多为 80 英寸和 3820 x 2160。

地理位置

许多移动设备使你可以确定用户的物理位置并传送针对该位置的信息或服务。

有三种选项可用于模拟 GPS。它们是“关”、“开”和“打开但无信号”,这些选项可用于测试不同的设备状态。设置为“开”时,你输入的“纬度” 和“经度”将被提供到网页中。

0 0
原创粉丝点击