Embed Size (px)
Citation preview
CS 192 1
JavaScript
Debbie Bartlett
CS 192 2
What is JavaScript?Purpose is to add interactivity to HTML pages Is a scripting language
i.e. interpreted languages, not compiled
Contains lines of executable computer codeUsually embedded directly into HTML pagesDoes not require a license
CS 192 3
Calculator
CALCULATOR VERSION 2 (Another Simple Calculator)
Passing Arguments to a JavaScript Function 1. In the top box, put the first number 2. In the second box, put the second number 3. Click on the operation you wish performed on these numbers 4. The answer appears in the bottom box
CS 192 4
Another Simple Calculator Example<html><head><Title> JavaScript Calculator Version 2</title><script language = "javascript">
function calculate(opCode){ with(document.calc) if(opCode == "+") result.value = eval(op1.value) + eval(op2.value); else if(opCode == "-") result.value = eval(op1.value) - eval(op2.value); else if(opCode == "*") result.value = eval(op1.value) * eval(op2.value); else if(opCode == "/") result.value = eval(op1.value) / eval(op2.value);}
</script>
</head><body BGCOLOR=#B0FFAA><H1> CALCULATOR VERSION 2 </H1><H2> Passing Arguments to a JavaScript Function </H2><P><OL><LI>In the top box, put the first number<P><LI>In the second box, put the second number<P><LI>Click on the operation you wish performed on these numbers<P><LI>The answer appears in the bottom box</OL><CENTER><H3><form name = "calc"><input name = "op1" type = "text"> <br><input name = "op2" type = "text"> <br><input name = "btnAdd" type = "button" OnClick =
"calculate('+')" value = "ADD"><input name = "btnSubtract" type = "button" OnClick =
"calculate('-')" value = "SUBT"><input name = "btnMultiply" type = "button" OnClick =
"calculate('*')" value = "MULT"><input name = "btnDivide" type = "button" OnClick =
"calculate('/')" value = "DIV"><br> <input name = "result" type = "text"></form></H3></CENTER></body></html>
CS 192 5
Assignment Visit the following website:
http://www.cs.colostate.edu/~cs192/.Fall14/assignments/Examples/index.html
Click on an example JavaScript View the source
Right click, view this frame only Right click, view source
Look at source, find script language tag Create new web page with this source and link to your main page
cd ~public_html gedit file_name.html & paste source in file_name and save ensure file_name is readable by all using chmod 644 file_name Use <a href=“file_name”>calculator</a> tag in your home page Ensure this works
Modify your JavaScript in some way For example, add button to square first number Ensure changes work Submit info requested in assignment via ramCT
