JQuery and browser compatibility

Question

Hop! I have been a developer for many years and have always tried to emphasize code that is compatible with as many systems as possible.

I recently bought a jQuery book in action and started reading it. I am very concerned about the fact that the source code does not work correctly in any of the browsers of my current computer.

In particular, I downloaded the source code of the book and selected the "JQuery Selectors Lab" for chapter 2. But it does not look like this in the book.

In Google Chrome, the DOM Sample and DOM Sample Code panels are completely empty. In IE7, everything looks much closer to how they appear in the book. But the source code in the DOM Sample Code panel is on one line (which extends to the right, from the page). Please note that the screenshots in the book have a browser running on Mac.

I'm curious what cross-compatibility users, more experienced with jQuery, find, and what this revelation means for developers who like to be as compatible as possible and plan to use jQuery.

Answer 1

jQuery is actively supported in all of these browsers:

• Firefox 2.0 +
• Internet Explorer 6+
• Safari 3+
• Opera 10.6 +
• Chrome 8+

There are known issues with legacy browsers according to the list below:

• Mozilla Firefox 1.0.x
• Internet Explorer 1.0-5.x
• Safari 1.0-2.0.1
• Opera 1.0-9.x
• Konqueror

jQuery usually works with Konqueror and Firefox 1.0.x, but there may be some unexpected errors, since we do not test them regularly.

If you use any of the legacy browsers, this may be your problem, otherwise you must post your code here on stackoverflow to get help. This may not be a browser issue, but it could be a way to write or execute code.

Answer 2

I think part of your problem is that you are accessing something from a file system designed to be downloaded from a web server. For example, I see this error in Chome in the example of chapter 2:

XMLHttpRequest cannot load file://...chapter2/dom.sample.html. Origin null is not allowed by Access-Control-Allow-Origin. 

It seems like Chrome has a good relationship with others than it was.

I usually use IE [789], Chrome, Firefox, Safari, and Opera, and I have not seen many browser problems specific to jQuery or jQuery-UI. The problems are mainly related to CSS issues and some JavaScript issues (in IE for both) that are not jQuery issues.

Answer 3

I would not worry too much about cross-browser jQuery compatibility as if the quality of the code were in the case of this book. I personally have not reviewed this book, so I can not judge personally; however, I am a leading developer of a web application that currently has about 15,000 users, and we have been using jQuery with confidence for a couple of years now without any problems. We must support customers on multiple platforms using all the major browsers that are on the market. When jQuery code is correctly written and tested for all environments, it can work fine no matter which browser you use.

Answer 4

JQuery version 3 is supported for the following desktop browsers:

• Chrome: (current - 1) and current
• Edge: (Current - 1) and Current
• Firefox: (current - 1) and current
• Internet Explorer: 9+
• Safari: (current - 1) and current
• Opera: Current

It is also supported for the following mobile browsers:

• Browser on Android 4.0+
• Safari on iOS 7+

Source: https://jquery.com/browser-support/

Answer 5

Code samples use legacy jQuery v1.4. Download the latest version and check for known issues for more information on cross-browser compatibility.

Answer 6

I don't know why, but if I copy the entire directory of examples to tomcat / webapps, it works fine. But if I open the page (lab.selectors.html) directly from the browser, it does not display the dom selection section. The error message from the firefox console was as follows:

[16: 56: 36.335] garbage after the document element @file: /// C: /JavaScript/jqia2/chapter2/dom.sample.html: 2