"Object doesn't support property or method 'querySelector'" shows when accessing site by machine name in IE11

All we need is an easy explanation of the problem, so here it is.

I have an angularjs site deployed to IIS on a Windows Server 2012 R2 host inside my firewall. When I RDP into the server and, from there, navigate to

http://localhost/Foo 

in IE11, everything behaves as one would expect;my page is served to the browser.

But, when I attempt to browse

http://servername/Foo

in IE11, I get an error thrown from line 1016 of angular.js

“Object doesn’t support property or method ‘querySelector'”

This only occurs in Internet Explorer.
Everything tested out fine in Chrome as well as Firefox.

Does anyone have a clue as to why this is happening and what I can do to fix it?

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1

The solution to this problem was to add the

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

tag as the first item in the Head.

The meta tag has to be the first tag in the head for IE to pick up edge mode; otherwise, it ignores the DOCTYPE that is supposed to instruct IE not to fall into quirks mode.

I had included the meta tag as an afterthought when I was deploying and had typed it in at the bottom of the head.

MSDN|Specifying Legacy Document Modes

The X-UA-Compatible header isn’t case sensitive; however, it must appear in the header of the webpage (the HEAD section) before all other elements except for the title element and other meta elements.

The default Compatibility Settings in Internet Explorer cause IE to silently behave differently for internal sites and external sites.

Setting the X-UA-Compatible meta tag explicitly declares that browsers should be receiving your internal site in Edge mode without the requirement of administrating Compatibility Settings, but the header must be specified as the first tag in the head in order to have this effect.

Method 2

Disable Compatibility view mode for your intranet and site that you’re trying to access and this will solve your problem.

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply