白吃篇
样子1
<html>2
<head>3
<title>This is a JavaScript example</title>4
<script language="JavaScript">5
<!--6
document.write("Hello World!");7
//-->8
</script>9
</head>10
<body> Hi, man! </body>11
</html>样子21
<html>2
<head></head>3
<body>4
<script>5
..// The code embedded in the <body> tags.6
</script>7
</body>8
</html>引用Js文件1
<script language="JavaScript" src="hello.js"></script>- Including an external file only functions reliably across platforms in the version 4 browsers.
- The code can't include tags
<script language...>and</script>, or you will get an error message.
Write and Writeln1
<PRE nd="27"><HTML>2
<HEAD>3
<TITLE> Welcome to my site</TITLE></HEAD>4
<BODY>5
<SCRIPT LANGUAGE="JAVASCRIPT">6
<!--7
document.write("Welcome to my site!");8
// -->9
</SCRIPT>10
</BODY>11
</HTML></PRE>Document object1
document.write("Hi there.")lastModified1
<script language="JavaScript">2
document.write("This page created by John N. Last update:" + document.lastModified);3
</script> bgColor and fgColor1
<script>2
document.bgColor="black"3
document.fgColor="#336699"4
</script>Message Box1
<body>2
<script>3
window.alert("Welcome to my site!")4
</script>5
</body>confirm1
window.confirm("Are you sure you want to quit?") prompt1
window.prompt("please enter user name") Variables and Conditions1
<script>2
var x=window.confirm("Are you sure you want to quit")3
4
if (x)5
window.alert("Thank you.")6
else7
window.alert("Good choice.")8
</script>prompt1
<script>2
var y=window.prompt("please enter your name")3
window.alert(y)4
</script>Example1
<html>2
<head>3
<script>4
var x=confirm("Are you sure you want to quit?")5
if (!x)6
window.location="http://www.yahoo.com"7
</script>8
</head>9
<body>10
Welcome to my website!.11
</body></html>Function1
function test()2
{3
document.write("Hello can you see me?")4
}调用事件1
function test()2
{3
document.write("Hello can you see me?")4
}5
test() Event handler1
<script>2
function ss()3
{4
alert("Thank you!")5
}6
</script>7
<form>8
<input type="button" value="Click here" onclick="ss()">9
</form>onLoad1
<body onload="ss()">2
<frameset onload="ss()">3
<img src="whatever.gif" onload="ss()">onMouseover,onMouseout1
<a href="#" onMouseOver="document.write('Hi, nice to see you!">Over Here!</a>2
<a href="#" onMouseOut="alert('Good try!')">Get Out Here!</a>onUnload1
<body onunload="alert('Thank you for visiting us. See you soon')">Handle multiple actions1
<form>2
<input type="button" value="Click here!" onClick="alert('Thanks3
for visiting my site!');window.location='http://www.yahoo.com'">4
</form>Form1
<form name="aa">2
<input type="text" size="10" value="" name="bb"><br>3
<input type="button"4
value="Click Here"onclick="alert(document.aa.bb.value)">5
</form>onBlur1
<html><head><script>2
function emailchk()3
{4
var x=document.feedback.email.value5
if (x.indexOf("@")==-1)6
{7
alert("It seems you entered an invalid email address.")8
document.feedback.email.focus()9
}10
}11
</script></head><body>调用OnBlur1
<form2
name="feedback">3
Email:<input type="text" size="20" name="email"4
onblur="emailchk()"><br>5
Comment: <textarea name="comment" rows="2" cols="20"></textarea><br>6
<input type="submit" value="Submit">7
</form>8
</body></html>Example1
<script>2
<!--3
function validate()4
{5
if(document.login.userName.value=="")6
{7
alert ("Please enter User Name")8
return false9
}10
if(document.login.password.value=="")11
{12
alert ("Please enter Password")13
return false14
}15
}16
//-->17
</script>18
<form name="login" onsubmit="return validate()">19
<input type="text" size="20" name="userName">20
<input type="text" size="20" name="password">21
<input type="submit" name="submit" value="Submit">22
</form>Protect a file by using Login1
<html><head>2
<SCRIPT Language="JavaScript">3
function checkLogin(x)4
{5
if ((x.id.value != "Sam")||(x.pass.value !="Sam123"))6
{7
alert("Invalid Login");8
return false;9
}10
else11
location="main.htm"12
}13
</script>Protect a file by using Login1
</head><body>2
<form>3
<p>UserID:<input type="text" name="id"></p>4
<p>Password:<input type="password" name="pass"></p>5
<p><input type="button" value="Login" onClick="checkLogin(this.form)"></p>6
</form>7
</body></html>Link1
<a href="JavaScript:window.location.reload()">Click to reload!</a>2
<a href="#" onClick="alert('Hello, world!')">Click me to say Hello</a><br>3
<a href="#" onMouseOver="location='main.htm'">Mouse over to see Main Page</a>Date1
<HTML><HEAD><TITLE>Show2
Date</TITLE></HEAD>3
<BODY>4
<SCRIPT LANGUAGE="JavaScript">5
var x= new Date();6
document.write (x);7
</SCRIPT>8
</BODY></HTML>Dynamically display different pages1
var banTime= new Date()2
var ss=banTime.getHours()3
if (ss<=12)4
document.write("<img src='banner1.gif'>")5
else6
document.write("<img src='banner2.gif'>")Date object Methods 1
getDate 2
getTime3
getTimezoneOffset4
getDay5
getMonth6
getYear getSeconds7
getMinutes8
getHours 9
Open a window1
<form>2
<input type="button" value="Click here to see" onclick="window.open('test.htm')">3
</form>Size, toolbar, menubar, scrollbars, location, status1
open("URL","name","attributes")2
For example:3
<form>4
<input type="button" value="Click here to see"5
onclick="window.open('page2.htm','win1','width=200,height=200,menubar')">6
</form>7
Another example with no attributes turned on, except the size changed:8
<form>9
<input type="button" value="Click here to see"10
onclick="window.open('page2.htm','win1','width=200,height=200')">11
</form>Here is the complete list of attributes you can add:1
width height toolbar 2
location directories status 3
scrollbars resizable menubar 4
Reload 1
window.location.reload()Close Window1
<form>2
<input type="button" value="Close Window" onClick="window.close()">3
</form>4
<a href="javascript:window.close()">Close Window</a>Loading1
window.location="test.htm"2
3
<a href="test.htm>Try this </a>4
5
<script>6
<!--7
function ss()8
{9
var ok=confirm('Click "OK" to go to yahoo, "CANCEL" to go to hotmail')10
if (ok)11
location="http://www.yahoo.com"12
else13
location="http://www.hotmail.com"14
}15
//-->16
</script>17
18
Remote Control Window1
Let's say you have opened a new window from the current window. After that, you will wonder how to make a control between the two windows. To do this, we need to first give a name to the window.Look at below:2
3
aa=window.open('test.htm','','width=200,height=200')4
5
By giving this window a name "aa", it will give you access to anything that's inside this window from other windows. Whenever we want to access anything that's inside this newly opened window, for example, to write to this window, we would do this: aa.document.write("This is a test.").6
7
example:8
<html><head><title></title></head>9
<body>10
<form>11
<input type="button" value="Open another page"12
onClick="aa=window.open('test.htm','','width=200,height=200')">13
<input type="radio" name="x" onClick="aa.document.bgColor='red'">14
<input type="radio" name="x" onClick="aa.document.bgColor='green'">15
<input type="radio" name="x" onClick="aa.document.bgColor='yellow'">16
</form>17
</body></html>opener1
Using "opener" property, we can access the main window from the newly opened window.2
3
<html>4
<head>5
<title></title>6
</head>7
<body>8
<form>9
<input type="button" value="Open another page"10
onClick="aa=window.open('test.htm','','width=100,height=200')">11
</form>12
</body>13
</html>14
15
<html>16
<head>17
<title></title>18
<script>19
function remote(url){20
window.opener.location=url21
}22
</script>23
</head>24
<body>25
<p><a href="#" onClick="remote('file1.htm')">File26
1</a></p>27
<p><a href="#" onClick="remote('file2.htm')">File28
2</a></p>29
</body>30
</html>Frame1
<html>2
<frameset cols="150,*">3
<frame src="page1.htm" name="frame1">4
<frame src="page2.htm" name="frame2">5
</frameset>6
</html>7
8
<html>9
<body>10
<h2>This is page 1 </h2>11
<a href="page3.htm"12
onClick="parent.frame2.location='page4.htm'">Click Here</a>13
</body>14
</html>"parent.frameName.location" to access another frame. "parent" standards for the parent frame containing the frameset code.
.jpg)
