SLW Jquery Final Exam Review

Asynchronous JavaScript and XML, allows you to send and receive information from the server without reloading the current page.

What is AJAX? What is its purposes?

selects one or more elements in the document. alias for the full function name jQuery()

What does the $() function do?

callback function

A ____ _____ can be used to allow further customization by the user or to execute code after your plugin tasks have completed.

conflicts

An important thing to remember when naming your plugin method(s) is that you want to avoid _____ with other jQuery or plugin method names.

places methods onea fter another to act on selected elements. You only have to write one line of code $("#my-element").removeClass("one-class").addClass("another-class");

Describe chaining and why it is useful in Query. Give examples.

False

Global methods are the best way to create a plugin, even if the plugin will act on elements within a collection.

var name = "variableName"; var name = 2;

How is a variable is declared in JavaScript?

append(), appendTo(), prepend (To)(), after(), InsertAfter(), before(), InsertBefore() empty(), remove(), detach()

How jQuery uses DOM to create new elements and remove elements?

invoke the attr() method with a single argument. gets an attribute: var attrValue = $("#my-element").attr("title"); setting an attribute: $("#my-element").attr("title", "Descriptive Title") attribute name, value

How jQuery uses DOM to get and set attribute values?

val() gets values from form element inputs $("#textbox-name").val(); client side validation

How to get values of various form element inputs? How to validate the form before getting input values?

a callback function

Most plugins can be used by simply calling a method, but many allow you to set options by adding _____ to the method call in your script.

names, values

Often when calling a method for a jQuery plugin, you are able to send a single argument: a map of property ____ and _____.

False

Plugins always require that additional options be set when calling a method.

JavaScript

Some plugins require just an extra _____ file, while others will also need you to include CSS files, images, or other media.

True

The JavaScript file for a plugin should be included in your HTML code before your own JavaScript file.

Math.random()

The _____ method can be used to generate a random number in JavaScript.

jCanvas

The _____ plugin is designed to make working with the HTML <canvas> element and its JavaScript API easier, as well as allow a canvas to work on both desktop and mobile devices.

animate

The jQuery UI plugin allows you to add arguments to certain method calls (such as show(), hide(), addClass(), and so on) that will _____ the changes to the element.

widgets

The jQuery UI plugin includes numerous _____ to enhance the user experience, which simply require you to call a method to make use of them.

desktop

The jQuery UI plugin is a library of related plugins that are designed to help Web applications feel more as if they are _____ applications.

$.extend()

The jQuery library gives you a helpful method named _____, which takes in two arguments: a map of default values and a map that will overwrite any default values with the new ones supplied while leaving any unchanged values alone.

first

The order in which the JavaScript files are included is important: You must include jQuery _____.

datepicker()

This jQuery UI plugin allows you to add a date picker to a text field.

Parsley.js

This plugin allows you to set particular HTML attributes and values in order to have it validate a simple form without the need to write additional jQuery/JavaScript code.

$.fn

To create a new jQuery object method, you will need to extend the jQuery object using jQuery.fn, which can be shortened to _____ when you assign the $ shortcut to your plugin code.

$

To make use of _____ internally for your jQuery plugin, you can use what is called an immediately invoked function expression.

CSS Level 3 Recommendation selectors

What CSS selectors does jQuery use?

JavaScript library,uses CSS selectors to access elements in the document, easier event handling. Accessible, addresses browser inconsistencies, provides plug ins

What and why is jQuery used in Web development?

Inserts content within each matched element immediately before the element's closing tag. $("<p>Thanks!</p>").appendTo(".my-elements");

What are append() and appendTo() methods? How to use them?

browser developer tools, lint tools

What are common used debugging methods/tools in coding JavaScript and jQuery?

number, string, Boolean, Undefined, Null

What are data types in JavaScript?

empty() - removes all elements and their children inside the matched elements (including text) remove() - removes the matched elements themselves in addition to all children of the matched elements (including text) detach() - works just like remove(), except it keeps a record of the detached elements so that you can add thme back to the DOM tree later if needed

What are differences among remove(), empty(), and detach()?

ready - allows the script ot run as soon as all of the elements have been loaded. Doesn't wait for images or media to load before it's triggered load - waits for docment and all media to load before it's triggered

What are differences between the ready() and load() methods?

alter opacity. fadeIn increases it, fadeOut decreases it. $("#book-show").click(function(event) { event.preventDefault(); $("#book-info").fadeIn("slow"); });

What are fadeIn() and fadeout() methods?

show and hide elements by animating only the height. Elements appear to slide up and down the page $("#element").eq(1).slideToggle("slow") slideToggle moves text in and out

What are slideUp() and slideDown() methods?

first - selects the first element of a collection $(".class element:first").addClass("newClass"); last - selects last element of a collection $(".class element:last").addClass("newClass"); element at index - selects element at a specific index. Index starts at 0. example below selects the second element $(".class element:eq(1)").addClass("newClass");

What are the first, last, and element at index selectors? Give examples.

download it from the jquery website, use a cdn (google, Micosoft, MediaTemple

What are two ways to obtain jQuery library?

interactive plug ins that you can use to enhance a web site

What are widgets?

show and hide elements in the document $("#element").hide(); $("#element").show();

What do the show() and hide() methods do? Give examples.

$(this)

What is a special selection in jQuery used to refer to the current element that fires event?

stores a list of data that is accessed by using an index number starting from 0

What is an array and its index? How to identify an element in an array?

a software routine that processes actions such as keystrokes and mouse movements.

What is an even handler?

A user performs some type of action suchas a mouse click, key press or form submission

What is an event?

submits form data behind the scenes, avoiding the typical page reload or redirect for the user once a form is submitted

What is input serialization?

You can switch back and forth between the two

What is the advantage of the toggleClass() method over the methods to add or remove classes?

$("#element").event(function(){ $("#element handling event").addClass("newClass"); });

What is the basic event handling method? How to call it?

A callback function is executed after the current effect is 100% finished. $(selector).hide(speed,callback);

What is the callback function for? Give examples?

'after' inserts the argument after the selector. 'insertAfter' inserts the selector after the argument.

What is the difference between after() and insertAfter() methods?

anonymous function - used whenthe function code is not reuseable $(document).ready(function(){}); defined function - used when the function will be reused function makeSpecial() { $(".about-me").addClass("special"); } $(document).ready(makeSpecial);

What is the difference between anonymous and defined function? Give examples of both.

animate() - allows you to customize what CSS properties are animated, speed, easing and callback when run. $("#my-element").animate({ property: value, property: value }, duration, easing, callback);

What is the method to create custom animations? General syntax?

gives languages access to the structure of the document. Made up of series of nodes.

What is the purpose of Document Object Model?

allows you to define a function that will be run once the elements of the document have loaded

What is the purpose of the ready() function?

a straightforward JS object containing properties and methods that are helpful to you when certain events are triggered. Works cross browser

What is the purpose of using event objects? What are contained in an event object?

A random number from 0 to 4

What will this code produce? Math.floor(Math.random() * 5)

A random number from 2 to 6

What will this code produce? Math.floor(Math.random() * 5) + 2

jquery-ui.min.css, jquery-ui.min.js

When using the jQuery UI plugin, you will need to include at least the _____ and _____ files.

display

Which css property can be altered using the animation method?

css(), addClass(), removeClass(), toggle(),

Which jQuery method(s) can be used to change the style of an element?

True

While you may have other callbacks that allow users to do things such as calculate values, you would most commonly add only one callback that would run when the other plugin tasks are complete.

True

With each additional global method, you increase the chances that one of the method names will conflict with another global name or plugin that will be used on the page.

this

Within your plugin method, the bare keyword _____ will refer to the current jQuery object, which is the collection of elements that was used to call it.

$("#my-element").start({ time: 1000, repeat: "none" });

Write a function to correctly calls a method named start() on #my-element with a map where time is set to 1000 and repeat is set to "none"?

implicit iteration

You need to be aware of how _____ ____ will affect your plugin.

jQuery

Your plugin should return a _____ object so that it can be chained to other jQuery methods.

False

Your plugins should never allow users to submit an options map to change your default values.

plugins

jQuery allows developers to create methods that can extend the jQuery library to provide additional features, which are called _____.