Javascript 当开发人员工具打开IE11时，站点的行为会有所不同

我在IE11中使用以下模板，无法理解为什么每次导航时边栏都会出现。当开发人员工具打开时，它的行为与我所希望的一样。在运行IE11时，单击树中UI元素下的任何一个选项卡都可以轻松演示。但是，您会注意到，如果F12开发人员工具处于打开状态，则不会在每次导航时滑入侧栏。这在chrome中不是一个问题。fastclick有一个错误，可能会出现，但是我在没有fastclick的情况下运行了，它仍然会发生。任何帮助都会很好。谢谢

---

尝试从代码中删除任何

console.log（）

console.log（）

它在调试Javascript时会帮助IE完全停止处理页面上的脚本。更神秘的是，如果你在IE中打开devtools的情况下一直关注你的页面，你根本不会注意到问题

解释

原因是除非在IE中打开了devtools，否则console对象不会实例化。否则，您将看到以下两种情况之一：

Javascript无法正确执行

控制台有一些神秘的错误，例如“对象未定义”或其他类似的错误

---

十有八九，你会在某个地方的代码中有一个错误的console.log。这不会影响IE以外的任何浏览器。

请尝试从代码中删除任何

console.log（）

console.log（）

它在调试Javascript时会帮助IE完全停止处理页面上的脚本。更神秘的是，如果你在IE中打开devtools的情况下一直关注你的页面，你根本不会注意到问题

解释

原因是除非在IE中打开了devtools，否则console对象不会实例化。否则，您将看到以下两种情况之一：

Javascript无法正确执行

控制台有一些神秘的错误，例如“对象未定义”或其他类似的错误

---

十有八九，你会在某个地方的代码中有一个错误的console.log。这不会影响除IE以外的任何浏览器。

我假设您已经修复了此问题，因为我看不到您在链接中描述的行为

然而，我最近遇到了一个类似的问题，即打开的开发工具改变了行为，不是因为控制台问题，而是因为打开工具改变了窗口的宽度。在我的例子中，正是窗口宽度的差异触发了一个潜在的bug

---

相关帖子。

我假设你已经修复了这个问题，因为我看不到你在链接中描述的行为

然而，我最近遇到了一个类似的问题，即打开的开发工具改变了行为，不是因为控制台问题，而是因为打开工具改变了窗口的宽度。在我的例子中，正是窗口宽度的差异触发了一个潜在的bug

---

相关帖子。

您可能在开发人员控制台中将兼容模式设置为IE的更高版本（请参见突出显示的部分）

您可能在开发人员控制台中将兼容模式设置为IE的更高版本（请参见突出显示的部分）

另一个潜在原因，尤其是在执行ajax调用时，当开发工具关闭时，ajax响应可能会被缓存，但当开发工具打开时，会从服务器刷新

---

在IE中，打开开发者工具的“网络”选项卡，单击“播放”图标，然后取消设置“始终从服务器刷新”按钮。然后观察是否有任何ajax调用返回的响应代码为304（未修改）。如果是，则无法从服务器获取新数据，需要更新通过ajax调用的页面上的可缓存性设置。

另一个潜在原因，尤其是在执行ajax调用时，是关闭开发工具时可能会缓存ajax响应，但在开发工具打开时从服务器刷新

---

在IE中，打开开发者工具的“网络”选项卡，单击“播放”图标，然后取消设置“始终从服务器刷新”按钮。然后观察是否有任何ajax调用返回的响应代码为304（未修改）。如果是，则您无法从服务器获取新数据，您需要更新通过ajax调用的页面上的可缓存性设置。

添加到已经很好的答案上（因为我无法评论-需要50个代表点），同意@sam100rav的答案和@storsoc的评论，我发现在IE11版本

11.1387.15063.0

和更新版本

11.0.90

（）中，

window.console

确实作为一个空对象存在（

window.console={}

）。因此，我使用了@storsoc的polyfill变体，如下所示

if（！window.console | | Object.keys（window.console）.length==0）{
window.console={
日志：函数（）{}，
信息：函数（）{}，
错误：函数（）{}，
警告：函数（）{}
};
}

在已经很好的答案的基础上（因为我不能评论-需要50个重复点），同意@sam100rav的答案和@storsoc的评论，我发现在IE11版本

11.1387.15063.0

和更新版本

11.0.90

（）中，

window.console

确实作为一个空对象存在（

window.console={}

）。因此，我使用了@storsoc的polyfill变体，如下所示

if（！window.console | | Object.keys（window.console）.length==0）{
window.console={
日志：函数（）{}，
信息：函数（）{}，
错误：函数（）{}，
警告：函数（）{}
};
}

如前所述，这是因为IE11+Edge如前所述，这是因为IE11+EDGELL对控制台的调用被注释掉了，现在检查了两次，仍然没有go@poptarts绝对法

window.console = typeof window.console !== 'object' || {};
console.warn = typeof console.warn === 'function' || function () {
  return this;
};
console.log = typeof console.log === 'function' || function () {
  return this;
};
console.info = typeof console.info === 'function' || function () {
  return this;
};
console.error = typeof console.error === 'function' || function () {
  return this;
};
console.assert = typeof console.assert === 'function' || function () {
  return this;
};
console.dir = typeof console.dir === 'function' || function () {
  return this;
};
console.table = typeof console.table === 'function' || function () {
  return this;
};
console.group = typeof console.group === 'function' || function () {
  return this;
};
console.groupEnd = typeof console.groupEnd === 'function' || function () {
  return this;
};
console.time = typeof console.time === 'function' || function () {
  return this;
};
console.timeEnd = typeof console.timeEnd === 'function' || function () {
  return this;
};
console.timeLog = typeof console.timeLog === 'function' || function () {
  return this;
};
console.trace = typeof console.trace === 'function' || function () {
  return this;
};
console.clear = typeof console.clear === 'function' || function () {
  return this;
};
console.count = typeof console.count === 'function' || function () {
  return this;
};
console.debug = typeof console.debug === 'function' || function () {
  return this;
};
console.dirxml = typeof console.dirxml === 'function' || function () {
  return this;
};
console.groupCollapsed = typeof console.groupCollapsed === 'function' || function () {
  return this;
};