jQuery vs. JavaScript

September 4, 2014

jquery = $

jquery.load('text.html') is the same as $.load('text.html')

Selecting an element by id

Javascript:

code

document.getElementById("#jumbo");

jQuery:

code

$("#jumbo");

Hiding an element

Javascript:

code

document.getElementById("#load").style.display = "none";

jQuery:

code

$("#load").hide();

Inserting HTML

Javascript:

code

var text = "hello there!";
document.getElementById("#page").innerHTML = text;

jQuery:

code

var text = "hello there!";
$("#page").html(text);

Loops

Javascript:

code

for (i = 0, i < items.length, i++) {};

jQuery:

code

$.each(array, function(i, item)){};

Making an AJAX request

Javascript:

code

xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
  if (xhr.readyState === 4) {
    if (xhr.status === 200) {
      document.getElementById("#ajax").innerHTML = xhr.responseText;
    }
  }
};
xhr.open("GET", "sidebar.html");
xhr.send();

jQuery:

code

$("#ajax").load("sidebar.html");