JavaScript By Example
Create a directory and using an editor key in the following programs . The java scripts are
embedded within the html files, so create a file with an html extension and enter the code as
given, one at a time. Load the Netscape Browser to see the output.
a1.html
<script>
document.writeln("hello");
</script>
a2.html
<script>
document.writeln("<h1>hello</h1>");
</script>
a3.html
<script>
document.writeln("<IMG SRC=\"joe.surf.yellow.small.gif\">");
</script>
a4.html
<script>
document.fgColor="#ff0000"
</script>
<FORM>
good boy
</FORM>
a5.html
<script>
document.bgColor="#ff0000"
</script>
<FORM>
good boy
</FORM>
a6.html
<script>
document.writeln("<h1>hello</h1>");
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" >
</FORM>
a7.html
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="alert('good')">
</FORM>
a8.html
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="confirm('good')">
</FORM>
a9.html
<script>
function aaa()
{ confirm("all okay");
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a10.html
<script>
function aaa()
{ document.bgColor="#ff0000"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a11.html
<script>
function aaa()
{ history.go(-1)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a12.html
<script>
function aaa()
{ alert(history.current)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a13.html
<script>
function aaa(f)
{ history.back()
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa(this.form)">
</FORM>
a14.html
<script>
function aaa()
{ history.forward()
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a15.html
<script>
function aaa()
{ top.location.assign('http://www.neca.com')
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a16.html
<script>
function aaa()
{ alert(location.pathname)
alert(location.toString())
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a17.html
<script>
function aaa()
{ window.status="hell"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a18.html
<script>
function aaa()
{ window.prompt()
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a19.html
<script>
function aaa()
{ a=window.prompt("hi","bye")
alert(a)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a20.html
<script>
function aaa()
{ window.open("a2.html")
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a21.html
<script>
function aaa(){
document.open("http://www.neca.com/~vmis/java.html")
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
</FORM>
a22.html
<script>
function aaa()
{ document.alinkColor="#ff0000"
}
function bbb()
{ document.alinkColor="#00ff00"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press" NAME="aa" onClick="bbb()">
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa()">
<A HREF="http://www.neca.com/~vmis/java.html">Hello</A>
</FORM>
a23.html
<FORM>
<A HREF="http://www.neca.com/~vmis/java.html" onMouseOver="alert('hi')">Hello </A>
</FORM>
a24.html
<FORM>
<A HREF="http://www.neca.com/~vmis/java.html" onClick="alert('hi')">Hello </A>
</FORM>
a25.html
<script>
function aaa(f)
{ alert(f.value)
alert(f.name)
alert(this.name)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa(this)">
</FORM>
a26.html
<script>
function aaa(f)
{ alert(f.value)
alert(f.name)
alert(f.method)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa(form)">
</FORM>
a27.html
<script>
document.writeln("<h1>hello</h1>");
function aaa(f)
{ a = confirm("all okay");
if (a)
f.ss.value="yes"
else
f.ss.value="no"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(form)">
<INPUT TYPE="text" NAME="ss" SIZE=9>
</FORM>
a28.html
<script>
document.writeln("<h1>hello</h1>");
function aaa(f)
{ a = confirm("all okay");
alert(a)
if (a)
form.ss.value="yes"
else
form.ss.value="no"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(form)">
<INPUT TYPE="text" NAME="ss" SIZE=9>
</FORM>
a29.html
<script>
document.writeln("<h1>hello</h1>");
function aaa(f)
{ a = confirm("all okay");
if (a)
f.value="yes"
else
f.value="no"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(ss)">
<INPUT TYPE="text" NAME="ss" SIZE=9>
</FORM>
a30.html
<script>
document.writeln("<h1>hello</h1>");
function aaa(f)
{ a = confirm("all okay");
if (a)
f.value="yes"
else
f.value="no"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(form.ss)">
<INPUT TYPE="text" NAME="ss" SIZE=9>
</FORM>
a31.html
<script>
document.writeln("<h1>hello</h1>");
function aaa(f)
{ a = confirm("all okay");
if (a)
f.ss.value="yes"
else
f.ss.value="no"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(this.form)">
<INPUT TYPE="text" NAME="ss" SIZE=9>
</FORM>
a32.html
<script>
function aaa(f)
{ alert(f.bb.checked)
f.bb.checked=false
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa(this.form)">
<INPUT TYPE="checkbox" NAME="bb" CHECKED>
</FORM>
a33.html
<script>
function bbb()
{ alert("hi")
}
function aaa(f)
{ alert(f.bb.value)
f.bb.checked=true
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" NAME="ss" onClick="aaa(this.form)">
<INPUT TYPE="checkbox" NAME="bb" CHECKED VALUE="off" onClick="bbb()">
</FORM>
a34.html
<script>
function aaa(f)
{ if ( f.qq[0].selected )
alert("one")
if ( f.qq[1].selected )
alert("two")
if ( f.qq[2].selected )
alert("three")
if ( f.qq[3].selected )
alert("four")
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(this.form)">
<SELECT NAME="qq"><OPTION SELECTED>hell<OPTION>Hello
<OPTION>Hi<OPTION>Goodbye
</SELECT>
</FORM>
a35.html
<script>
function aaa(f)
{ alert( f.qq.options )
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(this.form)">
<SELECT NAME="qq"><OPTION SELECTED>hell<OPTION>Hello
<OPTION>Hi<OPTION>Goodbye
</SELECT>
</FORM>
a36.html
<script>
function aaa(f)
{ for(i in f)
alert(i)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(this)">
</FORM>
a37.html
<script>
function aaa(f)
{ for(i in f)
{
j="name..."+i+" value.."+f[i]
alert(j)
}
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(this)">
</FORM>
a38.html
<script>
function aaa(f)
{ for(i in f)
alert(i)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(form)">
</FORM>
a39.html
<script>
function aaa(f)
{ for(i in f)
alert(i)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa(history)">
</FORM>
a40.html
<FORM>
<INPUT TYPE="button" VALUE="Press me">
<INPUT TYPE="text" VALUE="hi" NAME="ss" SIZE=9>
<INPUT TYPE="button" VALUE="hello" NAME="jj">
</FORM>
<script>
document.writeln(document.forms[0].jj.name);
document.writeln(document.forms[0].ss.value);
document.writeln(document.forms[0].elements[0].name);
document.writeln(document.forms[0].elements[1].value);
</script>
a41.html
<script>
function aaa()
{ a=new zzz
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a42.html
<script>
function aaa()
{ a=new zzz
}
function zzz()
{ alert("in zzz");
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a43.html
<script>
function aaa()
{ a=new zzz
alert(a.i)
a.i="Hell"
alert(a.i)
}
function zzz()
{
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a44.html
<script>
function aaa()
{ a=new zzz
alert(a.i)
a.i="Hell"
alert(a.i)
b=new zzz
alert(b.i)
a.j="Good"
alert(b.j)
}
function zzz()
{ this.i="hi"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a45.html
<script>
function aaa()
{ a=new zzz
alert(a.i)
a.i="Hell"
alert(a.i)
b=a
a.j="Good"
alert(b.j)
}
function zzz()
{ this.i="hi"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a46.html
<script>
function aaa()
{ a=new zzz("Hi","Bye")
alert(a.i)
alert(a.j)
b=new zzz("Good","Bad")
alert(b.i)
alert(b.j)
}
function zzz(x,y)
{ this.i=x
this.j=y
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a47.html
<script>
function aaa()
{ a=new zzz("Hi")
alert(a.i)
a.i="Bye"
b=new zzz("Hell")
alert(b.i)
a.aa()
b.aa()
ooo();
alert(a.bb())
}
function zzz(p)
{ this.i=p
this.aa=ooo
this.bb=ppp
}
function ooo()
{ alert("In ooo")
}
function ppp()
{ return "Bad"
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a48.html
<script>
function aaa()
{ a=new zzz("Hi")
b=new zzz("Bye")
a.cc("Good")
b.cc("Very Bad")
a.cc(100)
}
function zzz(p)
{ this.cc=ooo
}
function ooo(z)
{ alert(z)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a49.html
<script>
function ooo ()
{ return "bad"
}
function zzz(a,b)
{ this.aaa=a
this.bbb=b
this.ccc=ooo
}
function aaa()
{ a=new zzz(1,"hi")
alert(a.ccc())
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a50.html
<script>
function aaa()
{ a=10+20
alert(a)
b="Hi"+"Bye"
alert(b)
c=10+"20"
alert(c)
d="10"+20
alert(d)
e=10+"Hi"
alert(e)
f="10"+"20"
alert(f)
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a51.html
<script>
function aaa()
{ a=new zzz
alert(a[0])
a[0]="Hello"
alert(a[0])
a[1]="Hi"
alert(a[1])
}
function zzz
{
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a52.html
<script>
function aaa()
{ a=new zzz(4)
alert(a.l)
alert(a[0])
for(j=0; j<i;j++)
{ alert[j]
}
function zzz(i)
{ this.l=i
for(j=0;j<i;j++)
this[j]=j;
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>
a53.html
<script>
function zzz(x,y)
{ this.aaa=x
this.bbb=y
}
function aaa()
{ a=new zzz(1,"hi")
alert(a["bbb"])
alert(a[1])
}
</script>
<FORM>
<INPUT TYPE="button" VALUE="Press me" onClick="aaa()">
</FORM>