cis 375—web app dev ii javascript iii. 2 the string object a js string is an object with...

12
CIS 375—Web App Dev II JavaScript III

Upload: georgina-morgan

Post on 05-Jan-2016

220 views

Category:

Documents


1 download

TRANSCRIPT

Page 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

CIS 375—Web App Dev II

JavaScript III

Page 2: 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

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/tuto

rial1.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”

Page 3: 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

3

The Array Object Examplevar 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>")

}

Page 4: 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

4

The Date Object Examplevar 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())

Page 5: 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

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))

Page 6: 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

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)

Page 7: 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

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>

Page 8: 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

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>

Page 9: 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

9

The Form Object I Validating a form entry:

<html><head><script type = "text/javascript">function validate(){

x=document.myFormat=x.myEmail.value.indexOf("@")if (at == -1){

alert("Not a valid e-mail")

return false}

}</script></head>

<body>

<form name="myForm"action="tryjs_submitpa

ge.htm"onsubmit="return

validate()">

Enter your E-mail address:

<input type="text" name="myEmail">

<input type="submit" value="Send input">

</form>

</body></html>

Page 10: 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

10

The Form Object II 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>

Page 11: 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

11

The Form Object III 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>

Page 12: 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

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>