What browser incompatibilities does jquery solve?

I'm currently on the fence about using or not using jquery. I've spent hours researching the pros and cons of using jquery (or any library for that matter).

One of the big selling points of jquery is that it frees a developer from worrying about browser incompatibilities. I've tried to find any d开发者_如何学Pythonocumentation on exactly which incompatibilities it overcomes. So far I haven't found any. Can anyone help me out with this.

You should become very familiar with www.quirksmode.org.

It is an excellent browser-compatibility resource.

I don't think you'll find an actual list, but you can browse the source code and read the comments about certain code solving certain browser inconsistencies.

Examples

// check if target is a textnode (safari)
if ( event.target.nodeType === 3 ) {
    event.target = event.target.parentNode;
}

// safari subtracts parent border width here which is 5px
this.supportsFixedPosition = (checkDiv.offsetTop === 20 || checkDiv.offsetTop === 15);

To name a few, jQuery implements selecting DOM elements by class name in browsers that do not support the method document.getElementsByClassName (which is IE 8 and previous). So for example, you can select all of the elements with the class myClass with the following: $('.myClass').

jQuery has several useful wrappers around the XMLHttpRequest object, which has varying support across browsers (see here).

Also, jQuery takes care of some differences when it comes to DOM manipulation, like modifying attributes of elements or adding classes to elements, which as I recall, is slightly different in Firefox/IE.

Few of the things that i know are listed here:

IE has a different Event Model than Mozilla and some of the Gecko Borwsers which implement DOM2 Event Model. jQuery does a good justfication of provding browser independence by introducing jQuery Event Model.

IE does not supports css3 whereas Mozilla has support for css3. The jQuery selectors are independent of browsers selectors behaviour.

Mozilla does support method like document.getElementsByClassName however ie doesnt. But jQuery class selector prvents this issue as well.

IE and Mozilla has different properties for floats for ie its styleFloat for Mozilla its cssFloat jQuery gives us flag for cssFloat to uniquely determine it.

jQuery also has another flag jQuery.boxModel which tells users which boxModel your browser is supporting IE quirks mode or W3C compliant.

I have been working with jQuery for a while now and i can tell that the 26kb that it weights is a really small price, and like many other files only needs to be downloaded once (after that it gets loaded from the cache).

1. [Huge list of plug ins]

There are many plug ins for different solutions: galleries, validation, ajax, file handling, etc. Also you can use plug ins to [fix CSS problems]

2. Browser compatibility

Although i was not able to find a documented list of the fixes jQuery applies, you can always go over [the source code], it is very well documented and divided so you can see what happens when.

3. Consistent

While you work on different projects, if you keep using a library, you will learn more from it each time and work faster.

4. Community

jQuery probably the biggest in javascript libraries, and that comes with a lot of advantages like support, tutorials and plug ins.

5. DOM Manipulation

jQuery sintax makes it very easy to manipulate the DOM, instead of document.GetElementsByTagName("tag") you can do $("tag")

Bottomline

I can tell jQuery has saved a LOT of time for me, and made things easier to deal with, i would totally recommend using a library.