Does IE have more strict Javascript parsing than Chrome?

Question 1

This is not meant to start a religio-technical browser war - I still prefer Chrome, at least for now, but:

Because of a perhaps Chrome-related problem with my web page (see also), I temporarily switched to IE (10) to see if it would also view the time value as invalid.

However, I didn't even get to that point - IE stopped me in my tracks before I could get there; but I found that IE was right - it is more particular/precise in validating my code. For example, I got this from IE:

SCRIPT5007: The value of the property '$' is null or undefined, not a Function object

...which was referring to this:

<script src="/CommonLogin/Scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
 // body sometimes becomes white???? with jquery 1.6.1
 $("body").css("background-color", "#405DA7");
<

This line is highlighted as the culprit:

$("body").css("background-color", "#405DA7");

jQuery is referenced right above it - so why did it consider $ to be undefined, especially when Chrome had no problem with it...ah! I looked at that location (/CommonLogin/Scripts/) and saw that, sure enough, the version of jQuery there was actually jquery-1.6.2.min.js. I added the updated jQuery file (1.9.1) and it got past this.

So now the question is: why does Chrome ignore this? Does it download the referenced version from its own CDN if it can't find it in the place you specify?

IE did flag other errs after that, too; so I'm thinking perhaps IE is better at catching lurking problems than, at least, Chrome is. Haven't tested Firefox diesbzg yet.

Question 2

This question is a bit confusing at the moment. In any case, is it possible that Chrome was using a cached version of jquery?

Question 3

If the file was not resolvable then wouldn't you have all sorts of 404 errors - in the console tab and network tab in Chrome's developer tools?

Question 4

The web developer's mantra, "If it works in IE, but not the other browsers, your code is wrong." You can never trust IE to do anything right. Eventually, you'll find out the issue was with your code or Chrome was right in the first place.

Question 5

@ClayShannon IE11 already trails behind all other browsers and it's not even out yet. And then, there it will sit, for at least another year while every other browser moves the web forward every 6-8 weeks. I haven't compiled my list for that one yet.

Question 6

I'm voting to close this question as off-topic because browser comparison is not about software development.

Question 7

You were using an old version of jquery, as you admitted. The browser detection in that version was broken and so didn't define the global '$' jquery object. So when you tried to use it, it was not defined. You could put the non minified version of the js (the file without the 'min' part) and see where the $ is getting defined (or not getting defined).

Now getting onto Phil's answer, it's right but for the wrong reasons. He is saying you need to wait until dom ready by going $(document).ready. The only reason you need to do that is because you have your javascript in the head. Move it all to the bottom (which is better for speed, dom parsing). So you should have this as it will perform better.

<html>
<head>
<title>Test</title>
</head>
<body>
 <p>Test</p>
 <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
 <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 <script type="text/javascript">
 // no need to wait for ready since we are AFTER the body
 $("body").css("background-color", "#405DA7");
</body>
</html>

Other problems could be that the jquery file itself was sent mangled via gzip incorrectly. Another issue IE 11 has. This would result in $ not defined.

This has nothing to do with $(document).ready

Question 8

before you call ,ドル which is the variable for jquery, you need to let the page load first, then call any jquery object:

$(document).ready(function () {
 $("body").css("background-color", "#405DA7");
});

"Javascript statements are executed by the browser immediately and not when the DOM is ready." - See Pro jquery by Adam Freeman [http://www.apress.com/9781430240952] page 107

If you run the following In Firefox, Chrome and IE, it works. The background changes

<html>
<head>
 <title>Test</title>
 <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
 <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 <script type="text/javascript">
 $(document).ready(function () {
 $("body").css("background-color", "#405DA7");
 });
 </script>
</head>
<body>
 <p>Test</p>
</body>
</html>

If you remove the line:

 $(document).ready(function () {..}

and only have:

 $("body").css("background-color", "#405DA7");

It will not work.

Question 9

This wouldn't be any different. The $ is used regardless of $(document) vs $("body").

Question 10

@Phil Joe I'd right. Wrapping jQuery code in jQuery's domready event won't solve the problem because the domready function is part of the jQuery library.

Question 11

I understand page rendering and event binding, but a CSS directive is not an event binding. It's a nonstarter anyway because we're talking about $ being defined; it doesn't matter whether we use a selector or $(document), $ will be undefined in both cases. That's what I mean. Using $(document) doesn't define $.

Question 12

@Joel You're mistaking what this answer is explaining. <body> is what doesn't exist when that JS runs, which is why you have to wait for DOM load. That said, this doesn't explain the error in the question, which was about $ itself

Question 13

@PhilVallone Not true (unless it's an IE bug). The browser stops rendering (including further <script> tags) when it finds a references to an external JS file. The answer to the OP's question almost certainly involves either caching or Chrome doing something special behind-the-scenes.

dalore dalore 1463 bronze badges · Accepted Answer · 2015-01-28 15:04:17Z

You were using an old version of jquery, as you admitted. The browser detection in that version was broken and so didn't define the global '$' jquery object. So when you tried to use it, it was not defined. You could put the non minified version of the js (the file without the 'min' part) and see where the $ is getting defined (or not getting defined).

Now getting onto Phil's answer, it's right but for the wrong reasons. He is saying you need to wait until dom ready by going $(document).ready. The only reason you need to do that is because you have your javascript in the head. Move it all to the bottom (which is better for speed, dom parsing). So you should have this as it will perform better.

<html>
<head>
<title>Test</title>
</head>
<body>
 <p>Test</p>
 <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
 <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
 <script type="text/javascript">
 // no need to wait for ready since we are AFTER the body
 $("body").css("background-color", "#405DA7");
</body>
</html>

Other problems could be that the jquery file itself was sent mangled via gzip incorrectly. Another issue IE 11 has. This would result in $ not defined.

This has nothing to do with $(document).ready

Stack Exchange Network

Does IE have more strict Javascript parsing than Chrome?

2 Answers 2

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Hot Network Questions

Does IE have more strict Javascript parsing than Chrome?

2 Answers 2

Your Answer

Sign up or log in

Post as a guest

Post as a guest

Related

Hot Network Questions