CompSci 290
Spring 2021		 Web Application Development

Module 1 - Sample Quiz 2

Question 1

True or False: this is a correctly declared CSS-style color value.

#aliceblue
Check Answer

False, when using one of the pre-defined names, do not start with a # (that is only for hex codes)

 

Question 2

What is the purpose of the HTML <body> tag?

Check Answer

It represents the visible (non-metadata) content of the page.

 

Question 3

Write a single HTML tag that would be selected by the following CSS style definition:

#alpha {
    color: blue;
}
Check Answer 
<span id="alpha"></span>

 

Question 4

What is the syntax for a link to an external URL in HTML?

Check Answer 
<a href="https://www.cs.duke.edu/">Duke CompSci Department</a>

 

Question 5

What is wrong with the following HTML?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="author" content="COMPSCI 290">
  <title>Quiz</title>
  <style>
.blue {
    color: blue;
}
.big {
    font-size: 120%;
}
  </style>
</head>
<body>
  <h1 class="blue big">Hello, HTML</div>
</body>
</html>
Check Answer

The h1 tag is closed by a /div instead of a corresponding /h1.

 

Question 6

Write simple, concise JavaScript code that defines a function named f for which:

  • f(30, 20) === 10
  • f(101, 101) === 0
  • f(2, 3) === -1
Check Answer 
function f(a, b) {
  return a - b;
}

 

Question 7

Write JavaScript code to concatenate the first letters of each String in this array:

let words = [ 'alphabetical', 'code', 'remember', 'odd', 'names', 'you', 'make-up' ];
Check Answer 
let acronym = '';
words.forEach(w => {
  acronym += w[0];
});

 

Question 8

What does this GIT command do?

git add green_screen/*
Check Answer

Add all the files in the folder green_screen to GIT's "staging area" to prepare them to be committed.

 

Question 9

Write an <input> tag whose type is text, has an initial value of "Hello, HTML", and has an event handler that calls the function named superSecretProcess (which takes no arguments) when clicked.

Check Answer 
<input type="text" value="Hello, HTML" onclick="superSecretProcess()">

 

Question 10

Given the following fragment of HTML, which CSS style definition will cause the list items that normally appear one after another vertically to instead be ordered horizontally?

<navbar>
  <ul>
    <li><a href="https://www.duke.edu/">Duke University</a></li>
    <li><a href="https://www.cs.duke.edu/">Duke Computer Science</a></li>
    <li><a href="http://www.goduke.com/SportSelect.dbml?SPID=1846">Duke Basketball</a></li>
  </ul>
</navbar>
  1. navbar ul { display: inline; }
  2. navbar li { display: inline; }
  3. navbar { list-style-type: none; margin: 0; }
Check Answer

navbar li { display: inline; }

 

Question 11

What is wrong with the following HTML?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="author" content="COMPSCI 290">
  <title>Quiz</title>
</head>
  <h1>Hello, world</h1>
  <h2>Hello, Duke</h2>
  <h3>Hello, CompSci 290</h3>
</html>
Check Answer

It is missing the body tag.

 

Question 12

Assuming the following web page:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="author" content="COMPSCI 290">
  <title>CompSci Classes</title>
</head>
<body>
  <h1 id="header">Classes</h1>
  <ul id="options">
    <li><strong>290.2</strong></li>
  </ul>
</body>
</html>

Draw/describe what will appear on the web page after the following JavaScript is executed.

let item = document.createElement('li');
item.innerHTML = '<em>290.4</em>';
document.getElementById('options').appendChild(item);
Check Answer

A big heading that says Classes followed by, on separate lines, two bulleted items, one with a bold number 290.2 then one with an italicized number 290.4