background-color: #333; - Manual Certification Microsoft HTML5 CSS Javascript

Use CSS3 in Applications

Sub-Objective:

Find elements by using CSS selectors and jQuery.

References:

MSDN Library > Web Development > Internet Explorer > Internet Explorer Conceptual Content > Content Design and Presentation > Understanding CSS Selectors

Item: 44 (Ref:70-480.4.5.3)

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing a shipping form using HTML5. The form should accept an order number and store it as order_num. An order number must meet the following requirements:

z Begin with one or more digits.

z End with an uppercase letter.

z Digits and letters are separated by either a hyphen or colon.

The order number is required to submit the form. Which markup should you use? (To answer, type the complete element in the textbox. Specify only the needed attributes and place them in the order of id or name, type, pattern, min, max, step, and required.)

<input />

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using HTML5 elements.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Web applications >

HTML5 > Forms

MSDN Library > .NET Framework Regular Expressions > Regular Expression Language â€“ Quick Reference

Item: 45 (Ref:70-480.3.1.3)

You are developing a customer order form that contains the following elements:

<td><input id="name" type="text" placeholder="First Last" />td>

</tr>

<tr>

<td><label>Email:label>td>

<td><input id="email" type="email" />td>

</tr>

</table>

</div>

</form>

You want to label text bolded when a user is typing into its associated input. The label text should stay bolded to indicate form completion. Which text should you insert to complete the JavaScript code? (To answer, type the jQuery selector in the textbox. Be as specific as possible â€“ only those elements required should be affected.)

$(' ').each(function () {

$(this).parent().prev().children().css('font-weight', "bold");

});

Objective:

Use CSS3 in Applications

Sub-Objective:

Find elements by using CSS selectors and jQuery.

References:

jQuery API > Category > Selectors jQuery API > Category > Tree Traversal

Item: 46 (Ref:70-480.4.5.2)

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

Objective:

Implement and Manipulate Document Structures and Objects

Sub-Objective:

Implement HTML5 APIs.

References:

MSDN > Dev Center > Windows Store apps > Docs > API > HTML/CSS > Storage and state reference >

HTML5 Web Storage

Item: 47 (Ref:70-480.1.4.6)

You have a Web page that uses HTML5 Web storage. Match the JavaScript code on the left with its function on the right.

This question uses Adobe Flash player and Adobe Shockwave player. For this question to display correctly you must be using Internet Explorer with the latest version of Adobe Flash Player and Adobe Shockwave player. Your browser must permit flash files (.swf) to run. You MUST have your screen resolution set to 1024 x 760 to see all the options presented in the question by the Flash player.

Objective:

Use CSS3 in Applications

Sub-Objective:

Style HTML text properties.

References:

MSDN Library > Web Development > ASP.NET > ASP.NET 4 > Visual Web Developer Content Map > Visual Web Developer User Interface Elements > CSS Editor > New Style and Modify Style Dialog Boxes

Item: 48 (Ref:70-480.4.1.4)

You are using Visual Studio to develop a CSS style sheet. Paragraphs must be displayed as follows:

z All text must be justified on both sides of its margin.

z The first line should be indented by half an inch.

Using the Modify Style dialog box, click on the category option in the left pane to meet the requirements.

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

Objective:

Implement and Manipulate Document Structures and Objects

Sub-Objective:

Create the document structure.

References:

MSDN Magazine > Script Junkie > Using HTML5's New Semantic Tags Today

Item: 49 (Ref:70-480.1.1.3)

Match the HTML5 semantic markup on the left with its intended content on the right.

You have JavaScript code that must determine whether a product is available for fulfillment based on a stocking code. The following conditions must be met:

z The stocking code must be a five-digit string.

z The item must be unavailable for fulfillment if the stocking code is 00010.

You need to implement the following code to meet these conditions. Which text should you insert to complete the following code? (To answer, type the missing part of the expression in the textbox.) function checkForProd(stockCode) {

if (stockCode ) {

alert("Unavailable for fulfillment!");

} }

Objective:

Implement Program Flow

Sub-Objective:

Implement program flow.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript

Language Reference > JavaScript Reference > JavaScript Operators > Comparison Operators (JavaScript)

Item: 50 (Ref:70-480.2.1.7)

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing a web site using HTML5. You want to ensure the web site is available offline.

Which HTML5 API should you use?

Objective:

Implement and Manipulate Document Structures and Objects

Sub-Objective:

Implement HTML5 APIs.

References:

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer 10 Guide for Developers >

HTML5 > Application Cache API ("AppCache")

Item: 51 (Ref:70-480.1.4.2)

Application Cache Web Storage WebSockets Geolocation

You have the following on a Web page:

<script>

function loadProduct() {

var fr = document.getElementById('iframe').contentWindow;

fr.postMessage(product, "*");

}

</script>

<iframe id="iframe" src="product_details.html" onload="loadProduct();"></iframe>

The product_details.html page contains a function named displayProduct that accepts a Product object and renders it on the web page. You need to define the callback to use HTML5 Web Messaging. Which code segment should you use?

Objective:

Implement Program Flow

Sub-Objective:

Implement a callback.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Web applications >

HTML5 Web Messaging

Item: 52 (Ref:70-480.2.4.4)

window.addEventListener("start", function (data) { displayProduct(data);

});

window.addEventListener("onstart", function (data) { displayProduct(data);

});

window.addEventListener("message", function (msg) { displayProduct(msg.data);

});

window.addEventListener("onmessage", function (msg) { displayProduct(msg.data);

});

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing an online banking application that consumes the following object:

var accountInfo = { id: 40001, credentials: {

username: "jhester", password: "P@$$W0rd"

} };

Which expression(s) reference the value jhester? (Choose all that apply.)

Objective:

Access and Secure Data

Sub-Objective:

Consume data.

References:

MSDN Library > .NET Development > Articles and Overviews > Web Applications (ASP.NET) > ASP.NET >

Client-side Development > An Introduction to JavaScript Object Notation (JSON) in JavaScript and .NET

Item: 53 (Ref:70-480.3.3.5)

accountInfo[1]

accountInfo[1][0]

accountInfo.username

accountInfo.credentials.username

accountInfo2.getElementById('40001').credentials

accountInfo2.getElementsByTagName('username')[0].value

You are developing a web application for users to upload and share their photo albums. Each album consists of the following properties:

z Title and description

z Creation and modification dates

z Array of image file locations and descriptions

These properties are retrieved from a Windows Communication Foundation (WCF) service using the XMLHttpRequest object. You need to update a status label based on the current state of the request operation. Which event should you use?

Objective:

Access and Secure Data

Sub-Objective:

Consume data.

References:

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Web applications > XMLHTTPRequest (XHR) and AJAX Support > Objects > XMLHTTPRequest object (Internet Explorer)

Item: 54 (Ref:70-480.3.3.1)

onload onprogress

onreadystatechange ontimeout

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing an application for a restaurant chain that consumes an external web service. The web service provides a method named getLocalSpecials that returns a list of menu items that are available at a specific local restaurant.

You will use the jQuery method ajax to perform the web service request. The showLocalSpecials function will take the list of menu items and display it on the specials web page. The showLocalSpecials method should be executed only if these conditions exist:

z The request has completed.

z There are no server or data errors.

To which settings property should you assign showLocalSpecials?

Objective:

Implement Program Flow

Sub-Objective:

Implement a callback.

References:

jQuery.com > API Documentation > Ajax > Low-Level Interface > jQuery.ajax()

Item: 55 (Ref:70-480.2.4.2)

async cache complete success

You have JavaScript code that must determine whether a product quantity qualifies for a bulk discount. To qualify for a bulk discount, the quantity must be a multiple of 25.

You need to implement the following code to meet these conditions. The variable pQty is directly retrieved from an HTML textbox. Which text should you insert to complete the following code? (To answer, type the missing part of the expression in the textbox.)

if (pQty ) {

//Apply discount }

Objective:

Implement Program Flow

Sub-Objective:

Implement program flow.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript Language Reference > JavaScript Reference > JavaScript Operators > Comparison Operators (JavaScript)

Item: 56 (Ref:70-480.2.1.6)

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing a profile update form that includes the following markup:

<input id="pword" name="pword" type="password" />

You need to ensure that this field contains a value before submitting the form. Which JavaScript function should you use to perform validation?

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using JavaScript.

References:

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript Language Reference > JavaScript Reference > JavaScript Objects > String Object (JavaScript)

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript Language Reference > JavaScript Fundamentals > Data Types (JavaScript)

Item: 57 (Ref:70-480.3.2.6)

function validatePwd() {

return ! document.getElementById('pword').value.isEmpty();

}

function validatePwd() {

return ! document.getElementById('pword').value.match(//);

}

function validatePwd() {

return document.getElementById('pword').value.length > 0;

}

function validatePwd() {

return document.getElementById('pword').value.lastIndexOf(null) > 0;

}

You are developing a customer review form that includes the following markup:

<input id="rating" name="rating" type="range" min="1" max="5" /><br />

<textarea id="review" name="review" maxlength="100">Enter Your Review Here</textarea>

The review field will be sent via an HTTP GET operation. To prevent code injection, all special characters should be converted to character codes. Which JavaScript function should you use?

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using JavaScript.

References:

decodeURI Function (JavaScript)

decodeURIComponent Function (JavaScript)

Item: 58 (Ref:70-480.3.2.8)

encodeURI decodeURI

encodeURIComponent decodeURIComponent

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

You are developing a user profile form for a US bidding site. Customers must provide a valid phone number to receive text messages when they are outbid, lose or win an item.

The login page includes the following JavaScript code:

function isValidPhone(input) { var patternPhone;

return patternPhone.test(input);

}

To which value should you set the patternPhone variable?

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using JavaScript.

References:

(JavaScript)

MSDN Library > .NET Framework Regular Expressions > Regular Expression Language Quick Reference

Item: 59 (Ref:70-480.3.2.2)

/^[0-9]{3,}[0-9]{3,}[0-9]{4,}$/

/^[0-9]{,3}[0-9]{,3}[0-9]{,4}$/

/^1*[\s$-]*\d{3}[\s$-]*\d{3}[\s)-]*\d{4}$/

/^1?[\s$-]?\d{3}[\s$-]?\d{3}[\s)-]?\d{4}$/

You are developing a blog page that includes illustrations. Illustrations should display as follows in article text:

Both the position of an illustration and text flow around it should match the required display. Which text should you insert to complete the CSS rule? (To answer, type the CSS code in the textbox.)

.article {

display: -ms-grid;

-ms-grid-columns: 1fr 1fr 1fr;

-ms-grid-rows: 1fr 1fr 1fr;

}

.article-text {

text-align: justify;

-ms-grid-column: 1;

-ms-grid-row: 1;

-ms-grid-column-span: 3;

-ms-grid-row-span: 3;

}

.article-illustration { z-index: 1;

-ms-wrap-margin: 15px;

; }

Objective:

Use CSS3 in Applications

Item: 60 (Ref:70-480.4.3.4)

Copyright © 2015 Self Test Software, Inc. All Rights Reserved

Sub-Objective:

Create a flexible content layout.

References:

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer 10 Guide for Developers >

CSS > Grid layout

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer 10 Guide for Developers >

CSS > Exclusions

You are developing an order form using HTML5. The order form should accept a bulk quantity and store it as blk_qty. A bulk quantity must meet the following requirements:

z Must be a numeric value

z Cannot be less than 5 nor greater than 50

z Must only support multiples of 5

The bulk quantity is optional when submitting the form. Which markup should you use? (To answer, type the complete element in the textbox. Specify only the needed attributes and place them in the order of id or name, type, pattern, min, max, step, and required.)

<input />

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using HTML5 elements.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Web applications >

HTML5 > Forms

Item: 61 (Ref:70-480.3.1.2)

You are developing an order form that includes the following markup:

<input name="quantity" id="quantity" type="text" />

The quantity field must meet the following requirements:

z The user can specify only numeric values.

z The user must provide a numeric value to submit the order form.

Which attributes should you modify or add in the markup? (Choose all that apply.)

Objective:

Access and Secure Data

Sub-Objective:

Validate user input by using HTML5 elements.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Web applications >

HTML5 > Forms

MSDN Library > .NET Framework Regular Expressions > Regular Expression Language Quick Reference

Item: 62 (Ref:70-480.3.1.1)

type="range"

type="number"

step="1"

required="required"

pattern="\d"

pattern="[0-9]"

You are developing a custom mobile interface using HTML5. When a user performs a left or right swipe, then the button relative to that direction should be clicked.

Which method(s) should you use to raise the click event from a JavaScript function? (Choose all that apply. Each answer is an alternate solution.)

Objective:

Implement Program Flow

Sub-Objective:

Raise and handle an event.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Document Object Model (DOM) Core > Document Object Model (DOM) Events > Methods

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Document Object Model (DOM) Core > Document Object Model (DOM) Events > Legacy Platform Events > Legacy Event Methods

Item: 63 (Ref:70-480.2.2.3)

addEventListener attachEvent dispatchEvent fireEvent setCapture stopPropagation

You are developing company Web site that display industry-wide article. Header elements should display in uppercase and horizontally centered relative to their articles.

Which text should you insert to complete the CSS rule? (To answer, type the CSS properties and values in the textbox.)

article > header {

font : bold 32pt Arial , Verdana ; ; }

Objective:

Use CSS3 in Applications

Sub-Objective:

Style HTML text properties.

References:

MSDN Library > Internet Explorer Developer Center > Docs > Internet Explorer API reference > Cascading Style Sheets > Text

Item: 64 (Ref:70-480.4.1.6)

You are using CSS media queries to create an adaptive web page. The web page contains the following embedded stylesheet:

aside {

border: 1px solid;

}@media screen and (max-width: 480px) { article {width: 400px; margin: 5px;}

@media screen and (min-width: 480px) { article {width: 600px; margin: 15px;}

Which statement describes how the <aside> element will be rendered?

Objective:

Use CSS3 in Applications

Sub-Objective:

Create an animated and adaptive UI.

References:

MSDN Magazine > Script Junkie > Script Junkie | Respond to Different Devices With CSS3 Media Queries

Item: 65 (Ref:70-480.4.4.4)

Mobile devices with a maximum width of 480 pixels will display <aside> content within a second 200-pixel column to the right of its containing article.

Mobile devices with a maximum width of 480 pixels will display <aside> content within the same 400-pixel column as its containing article.

Devices that support a screen width over 480 pixels will display <aside> content as center-aligned.

Devices that support a screen width over 480 pixels will display <aside> content in 400-pixel column.

You have the following elements on an HTML5 Web page:

<section id="s1">

<article id="a1">

<header><h1 class="title">Article 1</h1></header>

</article>

<article id="a2">

<header><h1 class="title">Article 2</h1></header>

</article>

<article id="a3">

<header><h1 class="title">Article 3</h1></header>

</article>

</section>

You need to ensure that a yellow border appears around an article when its title is clicked. Which of the following JavaScript code segments should you use?

Objective:

Implement Program Flow

Sub-Objective:

Raise and handle an event.

Item: 66 (Ref:70-480.2.2.4)

document.getElementById('s1').addEventListener('click', function () { if( event.srcElement.classList.contains("title")) {

event.srcElement.parentElement.parentElement.style.border = "1px solid yellow";

} });

document.getElementById('a1').addEventListener('click', function () { if( event.srcElement.classList.contains("title")) {

event.srcElement.parentElement.parentElement.style.border = "1px solid yellow";

} });

document.getElementById('a2').attachEvent('onclick', function () {

event.srcElement.parentElement.parentElement.style.border = "1px solid yellow";

});

document.getElementById('a3').attachEvent('onclick', function () {

event.srcElement.parentElement.parentElement.style.border = "1px solid yellow";

});

You are developing an application that uses a remote third-party JavaScript library. The library provides an object named device, which is used in the following code:

var os, user_agent;

else console.log("ERROR: " + err.message);

}

Occasionally, the library is unavailable and an error is generated with following values:

z -2146823279

z 'device' is undefined

If this error is generated at runtime, what will be the console output?

Objective:

Implement Program Flow

Sub-Objective:

Implement exception handling.

References:

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript Language Reference > JavaScript Reference > JavaScript Statements > try...catch...finally Statement (JavaScript)

MSDN > Internet Explorer Developer Center > Docs > Internet Explorer API reference > JavaScript Language Reference > JavaScript Reference > JavaScript Objects > Error Object (JavaScript)

Item: 67 (Ref:70-480.2.3.1)

-2146823279

'device' is undefined

ERROR: 'device' is undefined WARNING: device unknown

In document Manual Certification Microsoft HTML5 CSS Javascript (Page 56-132)