jQuery — Then, Dequeue, and Descendants

Photo by Macau Photo Agency on Unsplash

jQuery is a popular JavaScript for creating dynamic web pages.

In this article, we’ll look at how to using jQuery in our web apps.

deferred.then()

The deferred.then() lets us add handlers that are called when the deferred object is resolved, rejected, or still in progress.

For example, we can write:

$.get("https://jsonplaceholder.typicode.com/posts/1")
  .then(
    function() {
      alert("$.get succeeded");
    },
    function() {
      alert("$.get failed!");
    }
  );

We make a request with $.get , which returns a deferred object.

Then we call then with the success callback as the first argument and the failure callback as the 2nd argument.

.delay()

The .delay() method sets a timer to delay the execution of subsequent items in the queue.

For example, if we have the following HTML:

<div id="foo"></div>

and CSS:

#foo {
  width: 200px;
  height: 200px;
  min-height: 100px;
  background-color: green
}

We can add a slide up effect, then show the fade-in effect after a delay by writing:

$("#foo").slideUp(300)…