C777 Unit 4: HTML5 APIs

application programming interface (API)

What is a collection of standards and programming instructions that enable access to a software application?

Canvas API

Which API is used for rendering visual images on the fly via scripting?

Which element is a transparent container for graphics?

height and width

What two attributes does the element have?

rectangle

What primitive shape does canvas support?

Document Object Model (DOM)

What is the standard specifying how objects in a Web document can be referred to and manipulated?

JavaScript

Which language is used to access HTML elements via the DOM?

getContext()

Which method returns a context object, which provides properties and methods that can be used to draw and manipulate images on the canvas?

fillRect(x,y,width,height)

Which method draws a filled rectangle?

strokeRect(x,y,width,height)

Which method draws a rectangular outline?

clearRect(x,y,width,height)

Which method clears the specified area and makes it fully transparent?

beginPath()

Which method begins a drawing path or resets the current path?

closePath()

Which method ends the current drawing path?

moveTo(x,y)

Which method moves the drawing pointer to a specified position?

arc(x,y,radius,startAngle,endAngle,anticlockwise)

Which method draws a curving line with a center, a given radius, a starting and ending angle (in radians), and instruction to draw in a clockwise or counterclockwise direction?

lineTo(x,y)

Which method draws a straight line from the current drawing position to the specified position?

stroke()

Which method adds a line to the path drawn?

fill()

Which method fills the area with the color set by the fillStyle property?

fillStyle

Which property sets the fill color or style?

lineWidth

Which property sets the thickness of the path drawn, in pixels?

WebGL API

Which API enables the rendering of interactive 3D and 2D graphics in an HTML canvas without the need for plug-ins?

canvas.getContext("webgl")

How is WebGL used with the HTML5 element?

offline web applications

Which API permits the user to continue working with Web sites and documents even when a network connection is unavailable?

application cache

What provides a directory on a computer where applications can be stored and run without access to the original application?

manifest

What file provides a list of files needed for a web application to work offline?

How do you identify the manifest file to which a Web page should link?

geolocation API

Which API provides the ability to determine a user's location?

getCurrentPosition()

Which method retrieves the current geographic location of the user?

watchPosition()

Which method retrieves periodic updates about the current geographic location of the user?

clearWatch()

Which method cancels an ongoing watchPosition() call?

Drag-and-drop API

Which API allows a user to grab an object on a computer screen and move it to a different location on the screen?

dragover

Which event specifies where the dragged data can be dropped?

draggable="true"

Which attribute make an element draggable?

preventDefault()

Which method prevents default action where data elements cannot be dropped in other elements?

drop

Which event is called when a page element is dropped after being dragged?

ondragstart

Which event listener triggers the drag event?

File API

Which API provides a standard way to interact with files on the client machine using a Web browser?

Which statement is the simplest way to reference several files at once?

FileList

Which interface provides a directory list of file objects. You can list information such as the file name, MIME type and size?

FileReader

Which interface provides read-only access to individual files, such as images?

Blob (Binary Large Object)

What data type is a collection of data stored as a single entity and provides the ability to divide a file into byte ranges?

History API

Which API allows you to add, change and delete URLs and titles in the browser history field?

history.back()

Which method sends the browser back one page in the history?

history.forward()

Which method sends the browser forward one page in the history?

history.go(number)

Which method sends the browser forward (positive number) or backward (negative number) the specified number of pages in the history?

history.pushState(state object, title, url)

Which method changes the URL in the browser window by adding a URL to the history stack?

history.replaceState(state object, title, url)

Which method replaces the current URL in the history with a new one, instead of adding another URL to the history stack?

history.length

What property returns the number of URLs in the history for this browser window?

history.state

What property returns the state object at the top of the history stack?

window.onpopstate

What property is called when the history changes for a document in the browser window?

XMLHttpRequest

What object is used to request data from a web server?

xmlhttp=new XMLHttpRequest();

How do you create a new XMLHttpRequest object?

AJAX

What technique is used to transmit data between a server and a web application without disturbing page display?

jQuery

What JavaScript library make it much easier to incorporate scripting on your website?

$("a")

Which jQuery command selects instances of the specified element based on the element name?

$("#custname")

Which jQuery command selects the elements with the specified ID attribute?

$(".demo")

Which jQuery command selects all elements with the specified class?

$("*")

Which jQuery command selects all HTML elements in the document?

$(this)

Which jQuery command selects the current HTML element?

$("a.demo")

Which jQuery command selects all instances of the specified element with the specified class?

$("a:first")

Which jQuery command selects the first instance of the specified element on a page?

$("[href]")

Which jQuery command selects all elements with the specified attribute?

$("a[target='_blank']")

Which jQuery command selects all instances of an element element with the specified attribute and value?

document.ready

Which jQuery command specifies that the code will not run until the document has finished loading?

text()

Which jQuery method sets or returns the text content of selected elements?

html()

Which jQuery method sets or returns the content of selected elements (including HTML markup)?

val()

Which jQuery method sets or returns the values of form fields?

attr()

Which jQuery method is used to get and set attribute values?

append()

Which jQuery method inserts content at the end of the selected elements?

document.getElementById("MyLocation")

What statement selects an HTML element using the ID attribute?

prepend()

Which jQuery method inserts content at the beginning of the selected elements?

after()

Which jQuery method inserts content after the selected elements?

before()

Which jQuery method inserts content before the selected elements?

remove()

Which jQuery method removes the selected element and its child elements?

empty()

Which jQuery method removes the child elements from the selected element?

if (navigator.geolocation)

What statement determines if the browser supports geolocation?

for (var i = 0, x = files.length; i < x; ++i)

What statement iterates through a set of files?

all browsers are DOM-compliant

What characteristic of all browsers means you do not need to develop multiple versions of your scripts tailored for each browser?

HTML5, CSS and JavaScript

What technologies make up HTML5 APIs