Javascript ch3

HFJS – Book
Review Ch3
Brady Cheng

Agenda
 Timer
 Display Size
 Cookie

Timer
 One shot timer

 Interval timer (loop timer)

One Shot Timer
 setTimeout ( “timeout action” , delay );

/* Millisecond!
* pop up an alert window after 5 sec
*/
setTimeout("alert('123')", 5*1000);

Interval Timer
 varTimerID = setInterval ( “timeout action” ,
delay);
 clearInterval ( TimerID);
Millisecond!
var timer;
function startIntervalTimer()
{
timer = setInterval("alert('hi')", 3*1000);
}
function stopIntervalTimer()
{
clearInterval(timer);
}

Display Size
 Static
 Physical size of your monitor
 Document.body.clientHeight
 Document.body.clientWeigth

 Dynamic
 try to scroll the mid-button in your mouse
while pressing ctrl button
 onresizeevent
 Ex. <body onresize = “doSomething();”>

Display Size
 Example 1
function showDisplaySize()
{
var width = document.body.clientWidth;
var height = document.body.clientHeight;
alert("width = " + width + ", height = " + height);
}

Display Size
 Example 2
function resizeEvent()
{
var new_width2 = document.body.clientWidth;
alert("resize width ratio ="+ old_width/new_width);
}
…
<body onload="showDisplaySize();" onresize = "resizeEvent()">

Cookie
 Data Persistence
 What can JS do?
 readCookie
 writeCookie
 eraseCookie

Cookie
 Check whether the cookie is supported

if(navigator.cookieEnabled)
{
//do something
}
else
{
JS build-in
//do other things
object
}

Fmt
example

Cookie
 Write cookie Fmt : name=XXX ; expires=someday

function writeCookie(name, value, days)
{
var expires = “”;
if (days)
{
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
expires = "; expires=" + date.toGMTString();
}
document.cookie = name + "=" + value + expires + "; path=/";
}

Cookie
 Read cookie
function readCookie(name)
{
var searchName = name + "=";
var cookies = document.cookie.split(';'); //array
for(var i=0; i < cookies.length; i++)
{
var c = cookies[i];
while (c.charAt(0) == ' ')
c = c.substring(1, c.length); //ignore the white space
if (c.indexOf(searchName) == 0) //cookie exist
return c.substring(searchName.length, c.length);
}
return null;
}

Cookie
 Erase cookie

function eraseCookie(name)
{
writeCookie(name, “”, -1);
}

Javascript ch3

Recommended

Recommended

More Related Content

What's hot

What's hot (12)

Viewers also liked

Viewers also liked (9)

Similar to Javascript ch3

Similar to Javascript ch3 (20)

Javascript ch3