Scribd
Upload
6 views

Jquery

This document provides an overview of a 6-lesson unit on jQuery. Lesson 1 introduces jQuery and the basic syntax. Lesson 2 covers jQuery functions, selectors, and event handlers. Lesson 3 teaches how to modify HTML elements by adding, removing, and moving them. Lesson 4 focuses on modifying element properties like classes, height, width, and content. Lesson 5 reviews event handlers and teaches effects like fading and animating. Lesson 6 introduces the jQuery UI library and its draggable, resizable, sortable, and accordion widgets. Each lesson includes exercises and identifies relevant computational thinking concepts and progression pathways.

Uploaded by

PrashantK
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
6 views

Jquery

This document provides an overview of a 6-lesson unit on jQuery. Lesson 1 introduces jQuery and the basic syntax. Lesson 2 covers jQuery functions, selectors, and event handlers. Lesson 3 teaches how to modify HTML elements by adding, removing, and moving them. Lesson 4 focuses on modifying element properties like classes, height, width, and content. Lesson 5 reviews event handlers and teaches effects like fading and animating. Lesson 6 introduces the jQuery UI library and its draggable, resizable, sortable, and accordion widgets. Each lesson includes exercises and identifies relevant computational thinking concepts and progression pathways.

Uploaded by

PrashantK
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 1

UNIT OVERVIEW: jQuery

Lesson

Course

Introduction
to jQuery

jQuery
Functions and
Selectors

Modifying
HTML
Elements

Exercises

1 - 13

1 - 13

Objectives
Understand what jQuery is used for, how it is linked to HTML/CSS and DOM !
Understand that jQuery is a library of JavaScript and the basic syntax such as <script>!
Understand what $(document).ready() is!
Understand the syntax of a function and implement
the .mouseenter(), .mouseleave(), .slideDown and .fadeTo() keywords

L2/4 data
L5 programming

30

Understand variables, how they are used in functions and how they are conventionally
named!
Implement event handlers and effects!
Recognise that functions can select elements, classes and IDs from HTML!
Recognise that functions can pass other functions and multiple selectors can be inputs

L3/5 programming

30

Understand how HTML elements can be dynamically added using .append(), .prepend() and
.appendTo() keywords!
L3 programming
Understand how to move elements and specify locations of new elements using
the .before() and .after() keywords

15

L7 data

25

Recognise and implement how to add, remove and toggle classes from a selector
using .addClass() , .removeClass() and .toggleClass()!
Understand that .height(), .width() and .css() event handlers can be used to modify CSS
elements!
Understand that HTML elements can be modified and implement using .html() and .val()!
Understand and implement the .on() general handler

Review jQuery event handlers such as .click() and learn .hover() and .dblclick()!
Recognise that multiple functions with effects can be passed into a single eveny handler !
Practice the .fadeOut(), .addClass() and removeClass() effects!
Understand and implement the .focus() event handler to a CSS element!
Practice adding a CSS element using .css() keyword!
Recognise and implement the keyDown() event handler and the .animate() effect

L7 data

30

Understand the jQuery UI library and the event handler .effect() on images and <div>s!
Understand and implement the following inputs to .effect() : 'explode', 'bounce', 'slide',
'draggable', 'resizable'.!
Recognise and implement UI event handlers that pass lists : .selectable(), sortable()!
Practice editing the HTML doc and implementing the .accordion() handler to an ID

L5 programming

30

Modifying
HTML
Elements

jQuery Events

jQuery Effects

6 - 14

1 - 12

Time
(min)

1-5

Progression Pathways

1 - 14

Computational thinking concepts: AB - Abstraction GL - Generalisation AL - Algorithms EV - Evaluation DE - Decomposition

You might also like