1

I'm learning javascript. Poked around this excellent site to gather intel. Keep coming across questions / answers about javascript, JQUERY, JQUERY with AJAX, javascript with JQUERY, AJAX alone. My conclusion: these are all individually powerful and useful. My confusion: how does one determine which/which combination to use ?

I've concluded that javascript is readily available on most browsers. For example, I can extend a simple HTML page with

<html>
<body>

<script type="text/javascript">
document.write("Hello World!");
</script>

</body>
</html>

However, within the scope of Python/DJANGO, many of these questions are JQUERY and AJAX related. At which point or under what development circumstances would I conclude that javascript alone isn't going to "cut it", and I need to implement JQUERY and/or AJAX and/or some other permutation ?

1
  • jQuery is a Javascript library, not something that you would implement.
    – Matt Ball
    Apr 28, 2010 at 17:38

3 Answers 3

4
  • Javascript is code that runs client-side in the browser.
  • AJAX is a term used to refer to the process of Javascript contacting the webserver directly and getting a response as opposed to the user navigating to a different page
  • jQuery is a javascript library that provides an easy-to-use abstraction over top of AJAX and the browser DOM
  • Django is Python code that runs server-side

In some situations you can do the same operation on either the client or on the server. Typically however, you determine if it should be done client/server by asking yourself, "where is the resource that needs to be used located?" For example, querying a database would be done on the webserver, because that's where that resource is. Conversely re-arranging the webpage's UI is done client-side, because that's where the the UI is.

Javascript alone can always "cut it", but the advantage jQuery brings is that it makes things easier and faster, and cuts out a lot of the browser issues in doing AJAX and DOM manipulation.

2

Since you are new to Javascript development, I'll try with relatable examples.

You can vote questions up or down on StackOverflow. Your vote action is sent to the server, and it gets recorded there. Had it not been for AJAX (and some other techniques), the entire page would need to be refreshed for that one action. AJAX solves the problem of asynchronously communicating with a server without requiring full page reloads.

jQuery is a library that provides convenient access to common Javascript tasks such as DOM manipulation, AJAX handling, etc. jQuery also hides away browser differences and provides a consistent interface for the end user. To illustrate these two points, see these examples:

finding all div elements on the page

// Javascript
var divs = document.getElementsByTagName("div")

// jQuery
$("div")

adding a click event handler to a button (illustrates browser differences)

With pure Javascript, it's best to create a cross-browser method to add events, as you surely wouldn't want to write this code every single time. Source - http://www.scottandrew.com/weblog/articles/cbs-events

function addEvent(obj, evType, fn, useCapture){
    if (obj.addEventListener) { // standards-based browsers
        obj.addEventListener(evType, fn, useCapture);
        return true;
    } else if (obj.attachEvent) { // IE
        var r = obj.attachEvent("on"+evType, fn);
        return r;
    } else { // some unknown browser
        alert("Handler could not be attached");
    }
}

​Once this is setup (one-time only), you can add events to any elements using this function.

// Javascript
var button = document.getElementById("buttonID");
addEvent(button, "click", function() { alert("clicked"); }, false);

// jQuery (contains code similar to above function to handle browser differences)
$("#buttonID").click(function() { alert("clicked"); });

AJAX is part of Javascript and not a separate technology in itself. You would use AJAX to avoid doing full page refreshes when you need to send/receive data from the server.

jQuery, MooTools, Dojo, Ext.JS, Prototype.JS, and many other libraries provide a wrapper around Javascript to abstract away browser differences, and provide an easier interface to work with. The question is would you want to do all of this re-work yourselves. If you're not exactly sure what re-work you may need to do, researching pure Javascript examples of common tasks such as AJAX calls, DOM manipulation, event handling, along with abstracting away browser quirks and comparing those to examples to equivalents in libraries such as jQuery might be a good start.

1

The reason are exactly the same as you choose to use Django instead of Python alone.

jQuery is javascript library which will make your life easier and extends javascript.

Beyond the fact that jQuery is useful, I advise you to learn javascript first, as you should have learnt python before to use Django.

To resume :

pure javascript => simple code, native function exists for what you need

jQuery => complex code, rich application, functions doesn't exists in pure javascript ($.each() method for example).

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.