1 / 12

CIS 375—Web App Dev II

CIS 375—Web App Dev II. JavaScript III. The String Object. A JS String is an object with properties and _________. For more info on JavaScript click here. http://www.pageresource.com/ http://hotwired.lycos.com/webmonkey/javascript/tutorials/tutorial1.html

dgoodloe
Download Presentation

CIS 375—Web App Dev II

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. CIS 375—Web App Dev II JavaScript III

  2. The String Object • A JS String is an object with properties and _________. • For more info on JavaScript click here. • http://www.pageresource.com/ • http://hotwired.lycos.com/webmonkey/javascript/tutorials/tutorial1.html • http://wdvl.internet.com/Authoring/JavaScript/Tutorial/ • Examples: var phrase = "W3Schools is great!“ // creates a String document.write(phrase.length) // displays “19” var pos = phrase.indexOf("School") // stores “2” document.write(phrase.substr(2,6)) // displays “School”

  3. The Array Object • Example var famName = new Array(6) // array w/ 6 items famName[0] = "Jan Egil" famName[1] = "Tove" famName[2] = "Hege" famName[3] = "Stale" famName[4] = "Kai Jim" famName[5] = "Borge" for (i=0; i<6; i++){ document.write(famName[i] + "<br>") }

  4. The Date Object • Example var today = new Date() // create a date object var weekday = new Array ("Sunday","Monday","Tuesday","Wednesday","Thursday", "Friday","Saturday") // create an array var monthname = new Array ("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug", "Sep","Oct","Nov","Dec") // create an array // display day of week document.write(weekday[today.getDay()] + “<br>") // display date document.write(today.getDate() + ". ") // display month and full year document.write(monthname[today.getMonth()] + " ") document.write(today.getFullYear())

  5. The Math Object • Example: // get a random number between 0 and 10 randomNum = Math.random()*10 /* round it up to an integer so that the result is a random integer from 1 to 10 */ document.write(Math.ceil(randomNum))

  6. The Window Object I • Example of a prompt box: var name = prompt("Please enter your name","") if (name != null && name != ""){ document.write("Hello " + name) } • Load a page in the current location: window.location="http://www.w3schools.com/“ • Print a page: window.print() • Detect a client’s browser: document.write("You are browsing this site with: "+ navigator.appName)

  7. The Window Object II • Opening two windows on a button click: <html> <head> <script language=javascript> function openwindow(){ window.open("http://www.microsoft.com/") window.open("http://www.w3schools.com/") } </script> </head> <body> <form> <input type = button value = "Open Window" onclick = "openwindow()"> </form> </body> </html>

  8. The Frame Object • Breaking out of a frame: <html> <head> <script type="text/javascript"> function breakout(){ if (window.top != window.self) { window.top.location="tryjs_breakout.htm" } } </script> </head> <body> <form> To break out of the frame: <input type="button" onclick="breakout()" value="Click me"> </form> </body> </html>

  9. Validating a form entry: <html> <head> <script type = "text/javascript"> function validate(){ x=document.myForm at=x.myEmail.value.indexOf("@") if (at == -1){ alert("Not a valid e-mail") return false } } </script> </head> <body> <form name="myForm" action="tryjs_submitpage.htm" onsubmit="return validate()"> Enter your E-mail address: <input type="text" name="myEmail"> <input type="submit" value="Send input"> </form> </body> </html> The Form Object I

  10. Setting Focus <html> <head> <script type = "text/javascript"> function setfocus(){ document.forms[0].field.focus() } </script> </head> <body> <form> <input type="text" name="field" size="30"> <input type="button" value="Get Focus" onclick="setfocus()"> </form> </body> </html> The Form Object II

  11. Displaying form field selections <html> <head> <script type = "text/javascript"> function check(browser){ document.forms[0].answer.value = browser } </script> </head> <body> <form> Which browser is your favorite<br> <input type = "radio" name = "browser" onclick = "check(this.value)" value = "Explorer"> MS Internet Explorer <br> <input type = "radio“ name = "browser" onclick = "check(this.value)" value = "Netscape"> Netscape Navigator <br> <input type = "text" name = "answer"> </form> </body> </html> The Form Object III

  12. The Browser Object • Detecting the client’s browser <html> <body> <script type="text/javascript"> document.write("BROWSER: ") document.write(navigator.appName + "<br>") document.write("BROWSERVERSION: ") document.write(navigator.appVersion + "<br>") document.write("CODE: ") document.write(navigator.appCodeName + "<br>") document.write("PLATFORM: ") document.write(navigator.platform + "<br>") document.write("REFERRER: ") document.write(document.referrer + "<br>") </script> </body> </html>

More Related