Exam 70-480 Programming in HTML5 with JavaScript and CSS3

Published: August 20, 2012
Languages: English, Chinese (Simplified), French, German, Japanese, Portuguese (Brazil)
Audiences: Developers
Technology: Microsoft Visual Studio 2012
Credit toward certification: MCP, MCSD

Skills measured
This exam measures your ability to accomplish the technical tasks listed below. The percentages indicate the relative weight of each major topic area on the exam. The higher the percentage, the more questions you are likely to see on that content area on the exam. View video tutorials about the variety of question types on Microsoft exams.

Please note that the questions may test on, but will not be limited to, the topics described in the bulleted text.

Do you have feedback about the relevance of the skills measured on this exam? Please send Microsoft your comments. All feedback will be reviewed and incorporated as appropriate while still maintaining the validity and reliability of the certification process. Note that Microsoft will not respond directly to your feedback. We appreciate your input in ensuring the quality of the Microsoft
Certification program.

If you have concerns about specific questions on this exam, please submit an exam challenge.

If you have other questions or feedback about Microsoft Certification exams or about the certification program, registration, or promotions, please contact your Regional Service Center.

Implement and manipulate document structures and objects (24%)
Create the document structure
Structure the UI by using semantic markup, including for search engines and screen readers (Section, Article, Nav, Header, Footer, and Aside); create a layout container in HTML
Write code that interacts with UI controls
Programmatically add and modify HTML elements; implement media controls; implement HTML5 canvas and SVG graphics
Apply styling to HTML elements programmatically
Change the location of an element; apply a transform; show and hide elements
Implement HTML5 APIs
Implement storage APIs, AppCache API, and Geolocation API
Establish the scope of objects and variables
Define the lifetime of variables; keep objects out of the global namespace; use the “this” keyword to reference an object that fired an event; scope variables locally and globally
Create and implement objects and methods
Implement native objects; create custom objects and custom properties for native objects using prototypes and functions; inherit from an object; implement native methods and create custom methods

Preparation resources
The developer’s guide to HTML5 canvas
How to zoom and pan with SVG

Implement program flow (25%)
Implement program flow
Iterate across collections and array items; manage program decisions by using switch statements, if/then, and operators; evaluate expressions
Raise and handle an event
Handle common events exposed by DOM (OnBlur, OnFocus, OnClick); declare and handle bubbled events; handle an event by using an anonymous function
Implement exception handling
Set and respond to error codes; throw an exception; request for null checks; implement try-catch-finally blocks
Implement a callback
Receive messages from the HTML5 WebSocket API; use jQuery to make an AJAX call; wire up an event; implement a callback by using anonymous functions; handle the “this” pointer
Create a web worker process
Start and stop a web worker; pass data to a web worker; configure timeouts and intervals on the web worker; register an event listener for the web worker; limitations of a web worker

Preparation resources
Controlling program flow (JavaScript)
Coding basic apps
try…catch…finally statement (JavaScript)

Access and secure data (26%)
Validate user input by using HTML5 elements
Choose the appropriate controls based on requirements; implement HTML input types and content attributes (for example, required) to collect user input
Validate user input by using JavaScript
Evaluate a regular expression to validate the input format; validate that you are getting the right kind of data type by using built-in functions; prevent code injection
Consume data
Consume JSON and XML data; retrieve data by using web services; load data or get data from other sources by using XMLHTTPRequest
Serialize, deserialize, and transmit data
Binary data; text data (JSON, XML); implement the jQuery serialize method; Form.Submit; parse data; send data by using XMLHTTPRequest; sanitize input by using URI/form encoding

Preparation resources
pattern attribute | pattern property
Sandbox
XMLHttpRequest object

Use CSS3 in applications (25%)
Style HTML text properties
Apply styles to text appearance (color, bold, italics); apply styles to text font (WOFF and @font-face, size); apply styles to text alignment, spacing, and indentation; apply styles to text hyphenation; apply styles for a text drop shadow
Style HTML box properties
Apply styles to alter appearance attributes (size, border and rounding border corners, outline, padding, margin); apply styles to alter graphic effects (transparency, opacity, background image, gradients, shadow, clipping); apply styles to establish and change an element’s position (static, relative, absolute, fixed)
Create a flexible content layout
Implement a layout using a flexible box model; implement a layout using multi-column; implement a layout using position floating and exclusions; implement a layout using grid alignment; implement a layout using regions, grouping, and nesting
Create an animated and adaptive UI
Animate objects by applying CSS transitions; apply 3-D and 2-D transformations; adjust UI based on media queries (device adaptations for output formats, displays, and representations); hide or disable controls
Find elements by using CSS selectors and jQuery
Choose the correct selector to reference an element; define element, style, and attribute selectors; find elements by using pseudo-elements and pseudo-classes (for example, :before, :first-line, :first-letter, :target, :lang, :checked, :first-child)
Structure a CSS file by using CSS selectors
Reference elements correctly; implement inheritance; override inheritance by using !important; style an element based on pseudo-elements and pseudo-classes (for example, :before, :first-line, :first-letter, :target, :lang, :checked, :first-child)

---

QUESTION 1
You are developing a web page that will be divided into three vertical sections. The main content of the site will be placed in the center section. The two outer sections will contain advertisements.
You have the following requirements:
? The main content section must be set to two times the width of the advertising sections.
? The layout must be specified by using the CSS3 flexible box model.
You need to ensure that the visual layout of the page meets the requirements.
Which CSS3 property should you use?

A. box-orient
B. box-flex-group
C. box-flex
D. box-direction

Answer: C
Reference:
https://www.html5rocks.com/en/tutorials/flexbox/quick/

---

QUESTION 2
You are developing a web application that consumes services from a third-party application. A web worker processes the third-party application requests in the background. A page in the application instantiates the web worker process.
You need to establish two-way communications between the web worker process and the page.
Which two actions will achieve this goal? (Each correct answer presents a complete solution. Choose two.)

A. From the web worker, use the onconnect event handler of the main page to capture events.
B. From the main page, use the onmessage event handler of the web worker to capture events.
C. From the web worker, use the onmessage event handler of the main page to capture events.
D. From the main page, use the onconnect event handler of the web worker to capture events.

Answer: B,C
Reference:
https://www.w3schools.com/html/html5_serversentevents.asp
https://www.html5rocks.com/en/tutorials/workers/basics/

---

QUESTION 3
You are developing a customer web form that includes the following HTML.
<input id = “txtValue” />
A customer must enter a value in the text box prior to submitting the form.
You need to add validation to the text box control.
Which HTML should you use?

A. <input id=”txtValue” type=”text” required=”required”/>
B. <input id=”txtValue” type=”text” pattern=”[A-Za-z]{3}” />
C. <input id=”txtValue” type=”required” />
D. <input id=”txtValue” type=”required” autocomplete=”on” />

Answer: A
Reference:
https://www.w3schools.com/html5/att_input_required.asp

---

QUESTION 4
You are creating a class named Consultant that must inherit from the Employee class. The Consultant class must modify the inherited PayEmployee method. The Employee class is defined as follows.
function Employee() {}
Employee.prototype.PayEmployee = function ( ){
alertt’Hi there!’);
}
Future instances of Consultant must be created with the overridden method.
You need to write the code to implement the Consultant class.
Which code segments should you use? (Each correct answer presents part of the solution. Choose two.)

A. Consultant.PayEmployee = function ()
{
alert(‘Pay Consulant’);
}
B. Consultant.prototype.PayEmployee = function ()
{
alert(‘Pay Consultant’);
}
C. function Consultant () {
Employee.call(this);
}
Consultant.prototype = new Employee(); Consultant.prototype.constructor = Consultant; D. function Consultant() {
Employee.call(this); } Consultant.prototype.constructor = Consultant.create;

Answer: B,C

---

QUESTION 5
You are developing an HTML5 web application and are styling text.
You need to use the text-transform CSS property.
Which values are valid for the text-transform property?

A. hidden
B. blink
C. capitalize
D. line-through

Answer: C
Reference:
https://www.w3schools.com/cssref/pr_text_text-transform.asp
none,capitalize,uppercase,lowercase and inherit Example
Transform text in different elements: h1 {text-transform:uppercase;}
h2 {text-transform:capitalize;} p {text-transform:lowercase;}

---

Click here to view complete Q&A of 70-480 exam
Certkingdom Review

Best Microsoft MCTS Certification, Microsoft 70-480 Training at certkingdom.com