Viltas S
Viltas S

Reputation: 11

JavaScript code working on other browsers but not working on IE11, why?

I am using this JS code to add a class on a activate bootstrap 4 navigation link, and on most browsers it is working, but on IE11 not. Any idea why?

"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');
  }
});

Upvotes: 0

Views: 248

Answers (3)

Viltas S
Viltas S

Reputation: 11

So, IE11 does not support forEach on a nodeList. I solved this problem by expanding the nodeList.prototype: NodeList.prototype.forEach = Array.prototype.forEach;

Upvotes: 0

user1464675
user1464675

Reputation:

IE11 only support up to ECMAScript 5, whereas other more modern browsers use ECMAScript 6. They don't intent on updating it either. ES 5 basically has less features for Javascript than ES 6, so that could be the culprit.

I like to use https://caniuse.com/ to see which functions are supported by which browser.

For example, it looks like querySelectorAll is supported by IE11: https://caniuse.com/#search=queryselectorall

EDIT: If you do wish to use ES6 features in IE11, you can have a look at BabelJS. https://babeljs.io/

Upvotes: 1

Jozef Cipa
Jozef Cipa

Reputation: 2227

Because of IE... :)

Check out your console output for errors. There will be some function that is not supported in ie 11

Unsupported querySelectorAll

Maybe unsupported classList property

Or maybe even forEach function

Upvotes: 1

Related Questions