Question

Please do this task using JavaScript (write code in JavaScript). It is preferable to do this...

Please do this task using JavaScript (write code in JavaScript). It is preferable to do this task in the environment “Google Docs”.

Create a table where students’ grades are stored. Let us suppose that students take 6 exams. Students’ grades range from 0 to 10.

Develop commands that let us:

1. Colorize in green the names of those students whose grades are higher than 5.

2. Colorize in red the names of those students whose grades are lower than 5.

3. Remove the colors.

4. Count the total number of all students.

Assign buttons to the corresponding commands.

0 0
Add a comment Improve this question Transcribed image text
Answer #1

<!DOCTYPE html>
<html>
<head>
   <title></title>
</head>
<body>
<div align="center" id="big">
   Follow is the list for students
  
   <table border="1px" id="table">
       <tr>
           <td class="name">
               Alex
           </td>
           <td class="marks">
           4  
           </td>

       </tr>
       <tr>
           <td class="name">
           Bob  
           </td>
           <td class="marks">
               5
           </td>

       </tr>
       <tr>
           <td class="name">
               catylyn
           </td>
           <td class="marks">
               6
           </td>

       </tr>
       <tr>
           <td class="name">
               Dylynn
           </td>
           <td class="marks">
               7
           </td>

       </tr>
       <tr>
           <td class="name">
               Eicipher
           </td>
           <td class="marks">
               2
           </td>

       </tr>
       <tr>
           <td class="name">
               Flinn
           </td>
           <td class="marks">
               9
           </td>

       </tr>
       <tr>
           <td class="name">
               Grin
           </td>
           <td class="marks">
               1
           </td>

       </tr>
   </table>
   <div id="count">
      
   </div>
   <br>
   <br>
   <br>
   <br><br>

<button onclick="myfunc1()">Turn Green</button>
<button onclick="myfunc2()">Turn Red</button>
<button onclick="myfunc3()">Turn Reset</button>
<button onclick="myfunc4()">Count number</button>


</div>

<script type="text/javascript">
   //document.getElementById('big').style.background="red"
   var tab = document.getElementById("table");
   console.log(tab.rows[0].cells[0].innerText)
   console.log(tab.rows.length)
  
   function myfunc1()
   {
       for (var i = 0; i < tab.rows.length; i++)

       {
       console.log(tab.rows[0].cells[1].innerText)
       if( tab.rows[i].cells[1].innerText > 5)
       {
          
           tab.rows[i].cells[0].style.background="green"
       }
      
       //console.log(tab.rows.length);
       }

   }
   function myfunc2()
   {
       for (var i = 0; i < tab.rows.length; i++)
       {
       console.log(tab.rows[0].cells[1].innerText)
       if( tab.rows[i].cells[1].innerText <= 5)
       {
          
           tab.rows[i].cells[0].style.background="red"
       }
      
       //console.log(tab.rows.length);
       }

   }

   function myfunc3()
   {
       for (var i = 0; i < tab.rows.length; i++)
   {
          
           tab.rows[i].cells[0].style.background="none"
  
   }

   }
   function myfunc4()
   {
       document.getElementById("count").innerText = "The total count is "+tab.rows.length;


   }
</script>
</body>
</html>

Add a comment
Know the answer?
Add Answer to:
Please do this task using JavaScript (write code in JavaScript). It is preferable to do this...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
  • Hello, Can you please error check my javascript? It should do the following: Write a program...

    Hello, Can you please error check my javascript? It should do the following: Write a program that uses a class for storing student data. Build the class using the given information. The data should include the student’s ID number; grades on exams 1, 2, and 3; and average grade. Use appropriate assessor and mutator methods for the grades (new grades should be passed as parameters). Use a mutator method for changing the student ID. Use another method to calculate the...

  • Can someone help fix this JAVASCRIPT code according to comment instructions javascriot code: window.addEventListener("click", () =>...

    Can someone help fix this JAVASCRIPT code according to comment instructions javascriot code: window.addEventListener("click", () => { console.log("You clicked?"); }); let button = document.querySelector("button"); button.addEventListener("click", () => { console.log("First Button clicked."); }); // How can we modify this so that it will occur when the 2nd button is clicked? // We need to use querySelectorAll which will produce a nodelist/array of all the buttons. Then we can reference which button we want to apply the click event using [] with...

  • Explain Autonomy (Task, Time, Team, and Technique) that you have at your present job. What would...

    Explain Autonomy (Task, Time, Team, and Technique) that you have at your present job. What would you change? Based on book, Drive by Daniel Pink (but don't need book to answer Q) - Read below or explanation and definitions " Pink argues that for a person to be motivated completely, he or she must have autonomy over four things in his or her work environment: Task, Time, Technique, and Team. without reinventing the wheel, allow me to explain (you should...

  • please do all in C++ code, thank you. Worth 1 point Checkpoint 7.12 Write a statement...

    please do all in C++ code, thank you. Worth 1 point Checkpoint 7.12 Write a statement that assigns the value 10 to the first elementof an array of integers named minutes. Type your program submission here Worth 1 point Checkpoint 7.14 Write a cout statement that will display contents of the second element of an array named courseNumbers Type your program submission here Submit Worth 1 point Checkpoint 7.15 Write a cin statement that will store the user's input in...

  • Please help with my car traffic simulator! Code that I already have below, I do not know how to...

    Please help with my car traffic simulator! Code that I already have below, I do not know how to start it off! public class IntersectionSimulation { private final static int EAST_WEST_GREEN_TIME = 30 ; private final static int[] NORTH_SOUTH_GREEN_TIMES = { 20, 24, 30, 42 } ; private final static int[] CAR_INTERSECTION_RATES = { 3, 5, 10 } ; private final static int[] CAR_QUEUEING_RATES = { 5, 10, 30 } ; private final static int[] EXPERIMENT_DURATIONS = { 3*60, 5*60,...

  • Your task is to develop a large hexadecimal integer calculator that works with hexadecimal integers of...

    Your task is to develop a large hexadecimal integer calculator that works with hexadecimal integers of up to 100 digits (plus a sign). The calculator has a simple user interface, and 10 \variables" (n0, n1, ..., n9) into which hexadecimal integers can be stored. For example a session with your calculator might look like: mac: ./assmt1 > n0=0x2147483647 > n0+0x3 > n0? 0x214748364A > n1=0x1000000000000000000 > n1+n0 > n1? 0x100000000214748364A > n0? 0x214748364A > exit mac: Note: \mac: " is...

  • SCREENSHOTS OF CODE ONLY!! PLEASE DON'T POST TEXT!! C++ CODE! PLEASE DON'T REPOST OLD POSTS! Objective...

    SCREENSHOTS OF CODE ONLY!! PLEASE DON'T POST TEXT!! C++ CODE! PLEASE DON'T REPOST OLD POSTS! Objective To gain experience with the operations involving binary search trees. This data structure as linked list uses dynamic memory allocation to grow as the size of the data set grows. Unlike linked lists, a binary search tree is very fast to insert, delete and search. Project Description When an author produce an index for his or her book, the first step in this process...

  • Write a C++ program named, gradeProcessor.cpp, that will do the following tasks: -Print welcome message -Generate...

    Write a C++ program named, gradeProcessor.cpp, that will do the following tasks: -Print welcome message -Generate the number of test scores the user enters; have scores fall into a normal distribution for grades -Display all of the generated scores - no more than 10 per line -Calculate and display the average of all scores -Find and display the number of scores above the overall average (previous output) -Find and display the letter grade that corresponds to the average above (overall...

  • Need code written for a java eclipse program that will follow the skeleton code. Exams and...

    Need code written for a java eclipse program that will follow the skeleton code. Exams and assignments are weighted You will design a Java grade calculator for this assignment. A user should be able to calculate her/his letter grade in COMS/MIS 207 by inputting their scores obtained on worksheets, assignments and exams into the program. A skeleton code named GradeCompute.java containing the main method and stubs for a few other methods, is provided to you. You must not modify/make changes...

  • Please use Java to write the program The purpose of this lab is to practice using...

    Please use Java to write the program The purpose of this lab is to practice using inheritance and polymorphism. We need a set of classes for an Insurance company. Insurance companies offer many different types of policies: car, homeowners, flood, earthquake, health, etc. Insurance policies have a lot of data and behavior in common. But they also have differences. You want to build each insurance policy class so that you can reuse as much code as possible. Avoid duplicating code....

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT