1 / 5

CS 192

JavaScript. Debbie Bartlett. CS 192. 1. 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 code Usually embedded directly into HTML pages Does not require a license. 2.

vidaparker
Download Presentation

CS 192

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. JavaScript Debbie Bartlett CS 192 1

  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 code • Usually embedded directly into HTML pages • Does not require a license 2 CS 192

  3. Calculator CALCULATOR VERSION 2 (Another Simple Calculator) Passing Arguments to a JavaScript Function • In the top box, put the first number • In the second box, put the second number • Click on the operation you wish performed on these numbers • The answer appears in the bottom box 3 CS 192

  4. Another Simple Calculator Example </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> <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> 4 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 5 CS 192

More Related