Individual Assignment - WK4
Once again, we will be adding to our resume page. Please reuse the basic HTML 5 template and existing CSS to minimize the workload for you.
What to hand in: Validate and upload to the web (perspub.albany.edu). Submit the URL to your new résumé webpage with the salary calculator and the debugging html.
Let’s create our first statement that writes to the
Within the body of the HTML, put an opening script tag and a closing script tag. Place the type attribute in the opening script tag and assign it the proper value as discussed in the
Do not forget a ; at the end of each line
Preview your page
Alternatively, we could store the text in a variable so that we could reuse it many times without needing to retype
Type the keyword var, to establish that we are creating a new variable. Give the variable a name, any name is fine as long as it is not a reserved word and meets the criteria from the reading. I am going to name my variable x, therefore I will write var x.
Notice that the left hand side of the equation is what we are assigning the value to and the right hand side of the equation is that value that is being
Replace the words to be printed in the document.write statement with your vari- able
Place the variable within the write method so it will be printed
Note that although the value of the variable is a string, and the variable therefore is a string type, the variable is still a variable and not a string. Because of this, we do not need quotes around the variable
Place the variable 5 times within the write method so it is printed out 5 times in a row
To do this you need to add, or concatenate, the strings together with the + operator. For me to do this, I would type x+x+x+x+x.
The + sign will add numbers together as well, but our data would need to be specified to be a number first or changed from a string to a number. Therefore even if our variable x = “5”, because 5 is in quotes it is being read as a string so adding it to another string (i.e. “3”) would return 53, not 8
Follow these instructions to place the code in a function: http://www.w3schools.- com/js/js_functions.asp
Our code to be executed is not only the document.write() statement, but also the line where we establish the variable and give it a value
Now our code will not run when the page loads, so we will need an event to hap- pen to run it. To keep things simple, we can add a button tag (https://w3schools.com/tags/tag_button.asp) except this time add the event at- tribute onclick. This onclick attribute will do something when the user clicks the button. What we want it to do is run our function, so we will set the onlcick value equal to the name of our function (i.e. if my function was named fun I would write
Now click the button and your function should run and print out what you asked it to.
But wait, where did our button go? It, along with any other HTML we had on the page will disappear if document.write() is run after the page initially loads. It is es- sentially replacing all of the document with just what is in between the ().
So underneath the button, let’s put a paragraph tag and have it read “this will change”
<p>this will change</p>
We are going to change the innerHTML property of this tag. The innerHTML of a tag is the stuff that is in between the opening and closing tags, which in this case is the text “this will change”
Once again I said we will change the innerHTML property of this element, so we will attach the innerHTML property to it by saying getElementById(“change”).in- nerHTML
Now all we need to do is say which object this element is associated with. It is within the document, so we can use the document object and specify that by say- ing getElementById(“change”).innerHTML
Now that we have identified what we want to change, let’s change it. We do that by setting what we want to change to be equal to the new value, so for me it is: document.getElementById(“change”).innerHTML = x+x+x+x+x;
Data types, user input, variables, and operators – the calculator (back to our resume page)
On a new page, create a function that calculates the yearly salary for a job from the hourly rate and hours per week. They will need to enter salary hourly rate and then the number of hours per week, so you can calculate the salary. Do not worry about taking into account overtime.
Based on the directions from the readings create two HTML text inputs that ask the user for 1)hourly wage and 2) hours per
Take the value entered for hourly wage and store it in a variable
Using an assignment operator, we will make the newly defined variable to be equal to the value that the user inputted. We can access what the user inputted by using the getElementById method, access the value property of the element (the input) with the specified ID within the document object
The value property simple looks at the value that is in the input box
Take the value entered for hours per week and store it in a second variable
Parse these two variables so that they are in a number format
Create a fifth variable (the two original input variables and the two parsed vari- ables are the other ones) and set it to equal the parsed hourly wage times by the number of hours per week times
DescriptionIn this final assignment, the students will demonstrate their ability to apply two ma
Path finding involves finding a path from A to B. Typically we want the path to have certain properties,such as being the shortest or to avoid going t
Develop a program to emulate a purchase transaction at a retail store. Thisprogram will have two classes, a LineItem class and a Transaction class. Th
1 Project 1 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of
1 Project 2 Introduction - the SeaPort Project series For this set of projects for the course, we wish to simulate some of the aspects of a number of