Javascript-Homework/assignmentCompareNumbers.html at main · Thinkgraser/Javascript-Homework · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>WDV221 Intro Javascript</title>
<script>
  function compareNumbers(){
    document.getElementById("result").style.color = "black";
    let value1 = parseFloat(document.getElementById("value1").value);
    let value2 = parseFloat(document.getElementById("value2").value);
    if(value1 == value2){
      document.getElementById("result").innerHTML = "Equal";
    }
    else if(value1 > value2){
      document.getElementById("result").innerHTML = value1;
    }
    else if(value1 < value2){
      document.getElementById("result").innerHTML = value2;
    }
    else{
      document.getElementById("result").style.color = "red";
      document.getElementById("result").innerHTML = "Please enter a number";
    }
  }
  function resetResult() {
    document.getElementById("result").innerHTML = "";
  }
</script>
</head>

<body>
<h2>WDV221 Intro Javascript</h2>
<h3>Comparisons and IF Statements - Compare Numbers Assignment </h3>
<hr />
<p>Please complete the following exercises on this page. When complete post this page to your  server. Make a link in your WDV221 homework  page for this assignment. </p>
<p>Include a comment in each script with the exercise number and a description of what the script is supposed to do.</p>
<p>Using Blackboard submit this  Assignment.</p>
<hr />
<form id="form1" name="form1" method="post" action="">
  <p>Value 1:
    <input type="text" name="value1" id="value1" />
  </p>
  <p>Value 2:
    <input type="text" name="value2" id="value2" />
  </p>
  <p>Result: <span id="result"></span>   </p>
  <p>
    <input type="button" value="Compare Numbers" onclick="compareNumbers()"/>
  </p>
  <p>
    <input type="reset" name="Reset" id="button" value="Reset" onclick="resetResult()"/>
  </p>
</form>

<p>Instructions:</p>
<ol>
  <li>Create a function called compareNumbers( ).</li>
  <li>The function will compare two numbers entered in the form above. </li>
  <li>The function should display the largest number or &quot;Equal&quot; if both values are the same.</li>
  <li>The results will be displayed in a span element using the .innerHTML property.</li>
  <li>Provide a reset function that will properly clear the form between attempts.</li>
</ol>
</body>
</html>