Chapter 1 Flashcards

Question 1

Q

You are developing an HTML5 web application and are styling text. You need to use the text-transform CSS property. Which value is valid for the text-transform property?
A. Lowercase
B. Blink
C. Line-through
D. 20px

Answer

A

A. Lowercase

Question 2

Q

You are developing a web page for runners who register for a race. The page includes a slider control that allows users to enter their age. You have the following requirements:

All runners must enter their age.
Applications must not be accepted from runners less than 18 years of age or greater than 90 years.
The slider control must be set to the average age (37) of all registered runners when the page is first displayed.

How the form element should like?

Answer

A

Answer:

input type=”range” min=”18” max=”90” step=”value” value=”37” required

Question 3

Q

You are creating a JavaScript object that represents an employee.
You need to extend the Employee object by adding the GetPayroll() method.
You need to ensure that all future instances of the Employee object implement the GetPayroll() method.

Which code segment should you use?

Answer

A

Employee.prototype.GetPayroll = function()
{
alert(“payroll”);
}

Question 4

Q

You are developing an HTML5 page that includes several paragraph elements. You have the following requirements:

Add a drop shadow that is one inch below the text in the paragraph
Set the radius of the drop shadow to five pixels

You need to style the paragraphs to meet the requirements. Which CSS style should you use?

A. Text-shadow: 72pt 0pt 5pt
B. Text-shadow: 5px lin 0px;
C. Text-shadow: 72pt 0em 5px;
D. Text-shadow: 100px 0px 5px;

Answer

A

B. Text-shadow: 5px lin 0px;

/* offset-x | offset-y | blur-radius | color */
text-shadow: 1px 1px 2px black;

/* color | offset-x | offset-y | blur-radius */
text-shadow: #CCC 1px 0 10px;

/* offset-x | offset-y | color */
text-shadow: 5px 5px #558ABB;

/* color | offset-x | offset-y */
text-shadow: white 2px 5px;

/* offset-x | offset-y
/* Use defaults for color and blur-radius */
text-shadow: 5px 10px;

Question 5

Q

You are developing an HTML5 web application and are styling text. You need to use the text-transform
CSS property.

Which value is valid for the text-transform property?

A. Capitalize
B. Red
C. 20px
D. Italic

Answer

A

A. Capitalize

//NOTE
text-transform : capitalize | uppercase | lowercase| none

Question 6

Q

You are modifying a blog site to improve search engine readability.
You need to group relevant page content together to maximize search engine readability.

Which tag should you use?

A. < article >
B. < table >
C. < div >
D. < span >

Answer

A

A. < article >

Question 7

Q

You are developing an HTML5 page that has an element with an ID of picture. The page includes
the following HTML.

< div >
Picture : <br></br>

You need to move the picture element lower on the page by five pixels.

Which two lines of code should you use? (Each correct answer presents part of the solution. Choose two.)

A. document.getEIementById(“picture”).style.position = “relative”;
B. document.getElementById(“picture”).style.top = “5px”;
C. document.getEiementById(“picture”).style.top = “-5px”;
D. document.getEIementById(“picture”).style.position = “absolute”;

Answer

A

Correct
A. document.getEIementById(“picture”).style.position =
“relative”;
B. document.getElementById(“picture”).style.top = “5px”;

Incorrect :
C. document.getEiementById(“picture”).style.top = “-5px”;
- This will move element 5 px up, not down
D. document.getEIementById(“picture”).style.position = “absolute”;
- This will take out the element from normal flow.

Question 8

Q

You are modifying a blog site to improve search engine readability. You need to group relevant page
content together to maximize search engine readability. Which tag should you use?
A. section
B. tbody
C. div
D. table

Answer

A

A. section

Question 9

Q

You are developing a customer web form that includes the following HTML.

You need to change the HTML markup so that customers can enter only a valid three-letter country
code. Which HTML should you use?

A. input id=”txtValue” type=”country”/
B. input id=”txtValue” type=”text” required=”xxx”/
C. input id=”txtVa!ue” type=”text” pattern=” [A-Za-z] {3} “/
D. input id=”txtValuen type=”code” pattern”=”country”/

Answer

A

C. input id=”txtVa!ue” type=”text” pattern=” [A-Za-z] {3} “/

Question 10

Q

You are developing an HTML5 web application and are styling text. You need to use the texttransform
CSS property. Which value is valid for the text-transform property?
A. Capitalize
B. Hidden
C. Italic
D. Line-through

Answer

A

A. Capitalize

Question 11

Q

You are modifying a blog site to improve search engine readability. You need to group relevant page
content together to maximize search engine readability. Which tag should you use?

A. tbody
B. article
C. div
D. span

Answer

A

B. article

Question 12

Q

You are modifying a blog site to improve search engine readability. You need to group relevant page
content together to maximize search engine readability. Which tag should you use?

A. span
B. nav
C. cable
D. section

Answer

A

D. section

Question 13

Q

You are creating an application by using HTML5 and CSS3. The styles for the pages are derived from
five style sheets. The styles are not being applied correctly to the pages in the application. You need
to determine the order in which the style sheets will be applied by the browser. In which order will
the five style sheets be applied?
- user agent style sheets
- user normal style sheets
- author normal style sheets
- author important style sheets
- user important style sheets

Answer

A

user normal style sheets
author normal style sheets
author important style sheets
user important style sheets
user agent style sheets

Question 14

Q

You develop an HTML5 webpage. You have the following HTML markup: 
table
  tr th th th
  tr td td td
  tr td td td
  tr td td td

table { border: 1px solid black; font-family: Arial;}
tr:nth-child(odd){background-color: red;}
tr td:nth-child(even){background-color: blue;}

You need to determine how the webpage will appear when the CSS styles are applied. Select two.
A. The first row of the table will have a red background.
B. The second row of the table will have a red background.
C. The second cell in the first row of the table will have a blue background.
D. The second cell in the third row of the table will have a blue background.
E. The second cell in the third row of the table will have not have blue background.

Answer

A

A. The first row of the table will have a red background.
B. The second row of the table will have a red background. - INCORRECT , second row is the even one and the style will not apply
C. The second cell in the first row of the table will have a blue background. - INCORRECT, first row contains only TH cells, not the TD one.
D. The second cell in the third row of the table will have a blue background. - CORRECT
E. The second cell in the third row of the table will have not have blue background. - INCORRECT - will have the blue background

// https://jsfiddle.net/ht7df4p7/2/

Question 15

Q

You are reviewing the CSS markup for an HTML5 page that displays a news article. The CSS markup
for the page is as follows:

h4 { color : powderblue; }
.headline { color: red; }
article { color: black; font-style: normal }
aside h4 { font-style: italic !important; color: yellow; }
article h4 { font-style: normal; color: sienna; }

div
  h4 international News
  article 
    h4 class="headline" New Developments
    aside
       h4 Impact on Markets

What is True:
A. The color of the International News header is red;
B. The color of the New Developments! header is black,
C. The color of the Impact On Markets header is yellow,
D. The text of the Impact On Markets header is italicized

Answer

A

A. The color of the International News header is red; - INCORRECT
B. The color of the New Developments! header is black,- INCORRECT
C. The color of the Impact On Markets header is yellow, - INCORRECT
D. The text of the Impact On Markets header is italicized - CORRECT

Question 16

Q

You review code that uses WebSockets for a browser-based multiplayer game. Each player sends a move to the server, which then sends the move to all connected game instances. The following code runs in the browser and handles the sending and receiving of moves:

var moveList = new Array();
var myMoves = {};

var server = new WebSocket('ws://gameserver.proseware.com/');
server.onmessage = funciton(message){
	if(myMoves[message.data.id] == undefined){
		moveList.push(message.data);
	}
}

server.onopen = function(){
server.send(getUserName());
};

function sendMove(){
	var nextMove = getMove();
	myMoves[nextMove.id] = nextMove;
	server.send(nextMove);
}

A. The moves are added to the moveList array in the order in wich they were played.
B. The username is sent to the server before any moves are sent or received.
C. The player’s own moves will be added to the moveList array.

Answer

A

A. The moves are added to the moveList array in the order in wich they were played. - CORRECT
B. The username is sent to the server before any moves are sent or received. - CORRECT
C. The player’s own moves will be added to the moveList array. - INCORRECT

Question 17

Q

You develop a webpage. The webpage must display a grid that contains one row and five columns. Columns one, three, and five are the same width. Columns two and four are the same width, but much wider than columns one, three, and five. The grid resembles the following image:

The grid must meet the following requirements: Each row must be tall enough to ensure that images are not cut off. Each row must contain five columns. The width of the columns must not change when the screen is resized or rotated. You need to define the style for the grid. Which CSS3 style should you use?

A. #grid {
	display: -ms-grid;
	-ms-grid-columns: 2fr (3fr 2fr) [2];
	-ms-grid-rows: auto;
}
B. #grid {
	display: -ms-grid;
	-ms-grid-columns: 100px (250px 100px)[2];
	-ms-grid-rows: min-content;
}
C. #grid {
	display: -ms-grid;
	-ms-grid-columns: 100px 250px 100px 250px 100px;
	-ms-grid-rows: auto;
}
D. #grid {
	display: -ms-grid;
	-ms-grid-columns: 100px 250px 100px 250px 100px;
	-ms-grid-rows: min-content;
}

Answer

A

C. #grid {
	display: -ms-grid;
	-ms-grid-columns: 100px 250px 100px 250px 100px;
	-ms-grid-rows: auto;
}

Question 18

Q

You implement an application by using HTML5 and JavaScript. You create a webpage that contains the following HTML:

< div id="container" >
	< ul >
		< li >First List Item< / li >
		< ul >
			< li >Child List Item< /li >
		< /ul >
		< li >Second List Item< / li >
		< li >Third List Item< / li >
		 < li >Fourth List Item< / li >
	< / ul >
	< p >Some interesting information that we need to display.< / p >
	< p >More information that is impoartant to this page.< / p >
< / div >

The application must place a border on only the first UL element that is contained in the DIV element. You need to update the webpage. What should you do?

A. $("div").each(function(){
		$("ul").each(function(index,domEle){
			$(domEle).css("border","1px solid black");
		});
	});

B. $(“div#container > ul”).css(“border”,”1px solid black”)

C. $(“ul:first-of-type”).css(“border”,”1px solid black”)

Answer

A

$(“div#container > ul”).css(“border”, “1px solid black”)

Question 19

Q

You troubleshoot a webpage that contains the following HTML element:

< canvas id=”clickCanvas” width=”300” height=”300” >
Your browser does not support the HTML5 canvas.
< / canvas >

The following JavaScript code is included in a script tag in the HEAD section of the webpage: (Line numbers are included for reference only.)

var canvas;
var context;
window.onload = function(){
	canvas = document.getElementById('clickCanvas');
	context = canvas.getContext('2d');
	drawBox();

}
function clickReporter(e) { alert('clicked'); }

function drawBox(){
	context.fillStyle = 'black';
	context.strokeRect(20,20,canvas.width - 20, canvas.height - 20);
}

You need to invoke the clickReporter() JavaScript function when a user clicks the mouse on the canvas HTML element. What should you do?

A. Add the following attribute to the canvas HTML element: clicked=
“clickReporter()”

B. Replace the code segment at line 06 with the following code segment:
drawBox.Click += clickReporter;

C. Insert the following code segment at line 07:
canvas.onclick = clickReporter;

D. Insert the following code segment at line 07:
canvas, click = clickReporter;

Answer

A

C. Insert the following code segment at line 07:

canvas.onclick = clickReporter;

Question 20

Q

dataTable > tr.selected:not(tr:last-child)

You are implementing an application by using HTML5 and JavaScript. A web page contains the following HTML table.

_table>
	_tbody>
		_tr>_td>..._/td>_/tr>
		_tr class="selected">_td>..._/td>_/tr>
		_tr>_td>..._/td>_/tr>
		_tr class="selected">_td>..._/td>_/tr>
		_tr>_td>..._/td>_/tr>
		_tr class="selected">_td>..._/td>_/tr>
	_/tbody>
	_tfooter>
		_tr class="selected">_td>..._/td>_/tr>
		_tr class="selected">_td>..._/td>_/tr>
		_tr class="selected">_td>..._/td>_/tr>
	_/tfooter>
_/table>
The application must:

Identify all rows in the table body that have a class attribute of selected
Exclude the last selected row in the table
You need to implement the web page according to the requirements. Which CSS selector should you use?

tr:not(tr:last-child).selected < #dataTable

Answer

A

dataTable tbody tr.selected:not(tr:last-child)

Question 21

Q

You create an application that sends information to a web service by using the following code: (Line numbers are included for reference only.)

function CustomError(code) { this.errorCode = code; }

var code = send();
if(code != 0){
	throw new CustomError(code);
}
When the web service returns a non-zero result code, you must raise an exception that contains the result code. You need to implement the code that generates the exception. Which line of code should you insert at line 04?

A. CustomError.prototype = Error.prototype;

B. CustomError [“ErrorType”] = Error;

C. CustomError.customError = true;

D. Error-constructor = CustomError;

Answer

A

A. CustomError.prototype = Error.prototype;

Question 22

Q

You are developing a customer web form that includes following HTML.

1
< input id=”textAccountType” / >
You need to develop the form so that customers can enter only a valid account type consisting of two English alphabet characters. Which code segment should you use?

A.  function validate(){
	var value = $("#txtAccountType").text();
	if(value == null || value == ""){
		alert("please enter a valid account type");
		return;
	}
}

B. function validate(){
	var value = $("#txtAccountType").val();
	var regex = /^[A-Za-z]{2}$/;
	if(!regex.test(value) || value == ""){
		alert("please enter a valid account type");
		return;
	}
}

C. function validate(){
	var value = $("#txtAccountType").val();
	if(value == null || value == ""){
		alert("please enter a valid account type");
		return;
	}
}

D. function validate(){
	var value = $("#txtAccountType").text();
	var regex = /^[A-Za-z]{2}$/;
	if(!regex.test(value) || value == ""){
		alert("please enter a valid account type");
		return;
	}
}

Answer

A

B. function validate(){
	var value = $("#txtAccountType").val();
	var regex = /^[A-Za-z]{2}$/;
	if(!regex.test(value) || value == ""){
		alert("please enter a valid account type");
		return;
	}
}

Question 23

Q

You are developing an application that uses a JavaScript library. The library contains the following functions.

function ValidateException(number,message){
	this.message = message;
	this.name = "myLibrary Validation Exception";
	this.number = number;
}

function LogicException(number,message){
	this.message = message;
	this.name = "myLibrary Logic Exception";
	this.number = number;
}

function myFunction(dayOfWeek){
	if(dayOfWeek > 7){
		throw new ValidateException(123, "Day of Week must be less than 7");
	}
}
The application uses the following code. (Line numbers are included for reference only.)

function doWork(value){
	try{
		myFunction(value){		
		} catch(e) {	}
	}
}
The library may throw many types of exceptions. The exceptions are grouped by category. You need to catch and identify the exceptions by group. Which code segment should you insert at line 05?

A. if(typeof(e) == "ValidationException"){
	handleValidationException(e.message);
}else if(typeof(e) == "LogicException"){
	handleLogicException(e.message);
}else{
	throw e;
}

B. if(e instanceof ValidationException){
	handleValidationException(e.message);
}else if(e instanceof LogicException){
	handleLogicException (e.message);
}else{
	throw e;
}

C. switch (e){
	case ValidationException:
		handleValidationException(e.message);
		break;
	case LogicException:
		handleValidationException(e.message);
		break;
	default:
		throw e;
}

D. if(e.message == “ValidationException”){
handleValidationException(e.message);
} else if(e.message == “LogicException”){
handleLogicException(e.message);
} else {
throw e;
}

Answer

A

B.
if(e instanceof ValidationException){
	handleValidationException(e.message);
}else if(e instanceof LogicException){
	handleLogicException (e.message);
}else{
	throw e;
}

Question 24

Q

You develop an HTML5 webpage. You have the following HTML markup:

_ul id="languages">
	_li>HTML_/li>
	_li>JavaScript_/li>
	_li>Classic ASP_/li>
	_li>ASP.Net_/li>
_/ul>
You also have the following JavaScript variable defined:

var languages = []
You need to add statements to an existing JavaScript function to sort the list items. Which four actions should you perform in sequence? (Develop the solution by selecting the required code segments and arranging them in the correct order.)

Answer

A

var items = document.getElementByTagName("i");
for (var i=0, l = items.length; i < l; i++){
languages.push(items[i].innerHtml);
}
language.sort();
for (var i=0, l = items.length; i < l; i++){
items[i].innerHtml = languages[i];
}

Brainscape's Knowledge GenomeTM

Chapter 1 Flashcards

Brainscape's Knowledge Genome^TM