Question

我正在使用此JS代码在激活的bootstrap 4导航链接上添加一个类，并且在大多数浏览器上它都可以工作，但在IE11上却不能。知道为什么吗？

"use strict";
var nav = document.querySelector('.navbar');
var links = nav.querySelectorAll('.highlight');
  links.forEach(function(link){
    if (link.href == window.location.href.split("#")[0]) {
      link.classList.add('active');
    }
  });

links.forEach(function(link){

  link.addEventListener('click', function(e) {
    links.forEach(function(link){
      link.classList.remove('active');
    });
      this.classList.add('active');
  });
});

var kontaktLink = document.querySelector('.kontaktLink');
var navBarToggle = document.getElementById('navbarSupportedContent');
var togglerButton = document.querySelector('.navbar-toggler');

kontaktLink.addEventListener('click', function() {
  if (navBarToggle.classList.contains('show')) {
    navBarToggle.classList.remove('show');
    navBarToggle.classList.add('collapse');
    togglerButton.classList.add('collapsed');
    togglerButton.setAttribute('aria-expanded','false');
  }
});

Answer 1

由于IE ...：）

检出控制台输出是否有错误。将会有一些功能，例如11

Unsupported querySelectorAll

Maybe unsupported classList property

Or maybe even forEach function

Answer 2

IE11仅支持多达ECMAScript 5，而其他更现代的浏览器则使用ECMAScript6。它们也不打算对其进行更新。 ES 5的Javascript功能基本上少于ES 6，因此可能是罪魁祸首。

我喜欢使用https://caniuse.com/查看哪个浏览器支持哪些功能。

例如，看起来IE11支持querySelectorAll： https://caniuse.com/#search=queryselectorall

编辑：如果您确实希望在IE11中使用ES6功能，则可以查看BabelJS。 https://babeljs.io/

Answer 3

因此，IE11在nodeList上不支持forEach。我通过扩展nodeList.prototype解决了这个问题： NodeList.prototype.forEach = Array.prototype.forEach;

JavaScript代码可在其他浏览器上运行，但不能在IE11上运行，为什么？

3 个答案: