Preview

03 - IF, LOOPS, and getElementByid

 1. The fancy name for the use of 'if statements' and the use of 'loops' are __________ and _______ respectively.

  ifilation / loopdum

  selection / iteration

  iteration / selection

  conditionals / repeats

 2. JavaScript can change the text of what is contained in an HTML paragraph (inside the p tags).

  False

  True

 3. In the following code, what is the id?
<p id="demo">The colour selecting app</p>

  'demo'

  the ending 'p' tag

  the 'colour'

  The 'p'

 4. The following line is placed inside the script tags as it is JavaScript. Which statement best describes what it does?
document.getElementById("demo").innerHTML = greeting;

  This will place the word 'greeting' inside the paragraph tag with the 'demo' id

  The getElementbyID command will display whatever is in the 'greeting' variable in the html text with the'demo' id

  This is the HTML rendering of JavaScript which allows a random greeting to be displayed

  This will open a document and name it 'greeting'

 5. In the following JavaScript code that uses if statements, what is missing?
<script>
var x=prompt("Enter a number and we will do something miraculous ....")
if (x<20) 
    document.getElementById("demo").innerHTML = "Intriguing, your number is LESS than 20";

</script>

  Nothing is missing

  The open and closing curly braces { and } that should encase the document.getElementById command

  The semi colon after the if statement. It should be if(x<20);

  The full stop after the last line

 6. What is missing from this script?
<!DOCTYPE html>
<html>
<body>

<p>Display "too young" if the age is less than 18</p>

<p id="demo">.............................</p>

<script>
var age=12;
if age < 18 {
    document.getElementById("demo").innerHTML = ">>Sorry, you are too young";
}
</script>

</body>
</html>

  var age=12; should be var age==12; (a double equals sign)

  age<18 in the if statement should be encased in ordinary brackets like this: (age<18)

  The document.getElementById command should not be in the script tags but above under the first html tag

  Nothing is missing

 7. In the following loop, which of the following statements is true?
var i;
for (i=0; i<10;i++){
  ctx.fillRect(x,x,20,20)
  x+=21
}

  In this code the loop is commanded to stop at 10, by the use of i<10;

  The i++ is the code that tells the i variable to keep incrementing, going from 0 to 10

  All the answers stated here are correct

  i=0 sets the starting value of variable i to 0

 8. The following code, that uses a for loop, only prints out the first three vegetables in the list. What needs to be changed in order for all vegetables to be printed?
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Loops</h2>

<p id="demo"></p>

<script>
var veg = ["Carrots", "Tomatoes", "Turnips", "Parsnips", "Peas", "Sweet corn"];
var text = "";
var i;
for (i = 0; i < 3; i++) {
    text += veg[i] + "<br>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

  The i++ needs to be changed to i=all

  The '3' in the for loop could be changed to veg.list

  The '3' in the for loop could be changed to 6, or to veg.length

  The '3' in the for loop could be deleted and replaced with the last three vegetable names

 9. In the following code, that uses a while loop, what should go at the end of the while loop?
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript while</h2>

<p id="demo"></p>

<script>
var text = "";
var i = 0;
while (i < 10) {
    text += "<br>The number is " + i;
    //What should go here?
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

  i++;

  stop =10

  10++

  i=0

 10. In the following code, can you predict the output?
<!DOCTYPE html>
<html>
<body>

<h1 id=demo2>JavaScript</h1>

<p id="demo1"></p>

<script>
var text = "boo";

document.getElementById("demo2").innerHTML = text;
</script>

</body>
</html>

  There will be an error, as you can only ever have one html ID

  On execution, the content of both the 'h1' and the 'p' tags will say 'boo'

  On execution, the content of the 'p' tag will say 'boo'

  On execution, the content of the 'h1' html tag will say 'boo'