Home > Developer > JavaScript
The fifth chapter uses the function
1. Declaring functions
<script>
function quote ()
{document.write ("output statement")
}
</script>
2. Call function
<script>
function quote ()
{document.write ("output statement")
}
QUOTE ()
</script>
3. Understanding global variables and local variables
Any variable declared without the var keyword is a global variable, and any variable declared outside the function is a global variable
4. Transfer parameters to function
<script>
function f (item)
{document.write ("Output parameter" +item+ "<br>")
}
F ("FGDFGD")
F ("parameter Two")
</script>
5. return value from function
<script>
function average (VAR1,VAR2,VAR3)
{ave= (VAR1+VAR2+VAR3)/3;
document.write ("output result");
Return Ave;
}
document.write (average (34,56,78))
</script>
6. Calling functions through HTML links
<script>
function quote () {
document.write ("Output string")
}
</script>
<a href=javascript:quote () > Calling functions via HTML link </a>
<a href=javascript:document.write ("output character") > Call function via HTML link, write JavaScript statement directly </a>
Chapter sixth dealing with events
1. Check the mouse click
<form name=form1>
<input Type=button name=button1 Value=hello onclick=document.form1.button1.value= ' there ' >
</form>
2. Detect Double click
<form name=form1>
<input Type=button name=button1 value=hello onclick=document.form1.button1.value= ' You clicked the button ' ondblclick= Document.form1.button1.value= ' You double-click the button ' >
</form>
3. Create a hover button
4. Test key
<form name=form1>
<input type=text name=text1 Value=hello onkeypress= "if (window.event.keycode== ') document.form1.text1.value= '" You pressed the D key ' ">
</form>
5. Set Focus
<form name=form1>
<input Type=text Name=text1 Value=hello
Onfous=document.form1.text1.value= ' This text box gets focus '
Onblur=document.form1.text1.value= ' The text box loses focus ' >
</form>
6. Detect Pull-down Menu Selection
<form name=form1>
<select Name=select1 size=4
Onchange=document.form1.text1.value=document.form1.select1.value>
<option value= "Beijing" > Beijing </option>
<option value= "Shanghai" > Shanghai </option>
<option value= "Wuhan" > Wuhan </option>
<option value= "Tianjin" > Tianjin </option>
<option value= "Dalian" > Dalian </option>
</select>
<input Tppe=text Name=text1 value=hello>
</form>
7. Create Web loading and unloading information
<body onload=document.form1.text1.value= ' page load complete ' Onunload=alert (' Goodbye, Welcome again ') >
<form name=form1>
<input type=text name=text1 value= "page is loading ..." >
</form>
Chapter seventh the use of objects
1. Understanding objects \ Properties and methods
<body bgcolor= "Green" >
<script>
document.write ("Page background color is:" +document.bgcolor)
document.write ("page foreground color is:" +document.fgcolor)
</script>
2. Using page Element objects
<script>
</script>
<form name=form1>
<textarea name=ta1>dfgfdgfdhfdhdfdfgdf</textarea>
<input Type=button value= "Select text" Onclick=document.form1.ta1.select () >
<input Type=button value= "display text" Onclick=document.write (document.form1.ta1.value) >
</form>
3. Using child objects
<form name=form1>
<input Type=text Name=text1 value=hello>
</form>
<script>
Document.form1.text1.value= "GDFGFD"
</script>
<form name=form1>
<input Type=radio name=radio1> Male
<input Type=radio name=radio2> Female
</script>
<script>
Document.form1.radio1.checked=true
</script>
4. Using Predefined objects
<script>
Str1= "Dgdfgdfgdfhf fixation method for martial arts attack"
document.write (str1+ "<br>")
STR2=STR1.SUBSTR (5)
document.write (str2+ "<br>")
document.write ("area of the output circle:" +math.pi*math.pow (5.0,2))
</script>
5. Create a new object
<script>
Today=new Date ()
document.write ("Today is" + (Today.getmonth () +1) + "month" +today.getdate () + "Day" + "<br>")
document.write ("Now Is:" +today.tolocalestring ())
</script>
6. Referencing the current object
<form name=form1>
<input type=text name=text1 value= "DGDGDFGFD" Onclick=this.select () >
</script>
7. View Object Properties
<script>
For (prop in window)
{document.write ("window.") +prop+ "=" +window[prop]+ "<br>");}
For (Prop2 in location)
{document.write ("location.") +prop2+ "=" +location[prop]+ "<br>");}
</script>
8. Use the Array object
<script>
Array=new Array (10)
array[0]= "Bark"
array[1]= "Apple"
array[2]= "Nebula"
array[3]= "Cookies"
array[4]= "Technology"
document.write (the number of array elements is +array.) length+ "<br>")
document.write (merge array with join +array.join ("") + "<br>")
document.write ("Array Sort" +array.sort ())
</script>
9. Using the Image Object
<script>
document.write ("Photo tip is:" +document.images[0].alt+ "<br>")
document.write ("Picture border size is:" +document.images[0].broder)
</script>
10. Pre-loading image
<script>
Freddy=new Image ()
Freddy.src=http://www.webjx.com/htmldata/2006-06-08/freddy.gif
</script>
<body onload=document.images[0].src=freddy.src>
,
</body>
11. Change the image
<br>
<form name=form1>
<input Type=button name=button1 value= "Change image" onclickd=document.images[0].src=http://www.webjx.com/htmldata/ 2006-06-08/dudjp.gif>
</form>
12. Use Link and Anchor objects
<a name=anchor1> Anchor Point 1<br>
<a href=http://www.microsoft.com>microsoft</a><br>
<a href=http://www.sohu.com>sohu</a><br>
<a href=http://www.sina.com.cn>sina</a><br>
<script>
document.write ("This page has a total of" +document.links.length+ "link" + "<br>")
document.write ("This page has a total of" +document.anchors.length+ "anchor" + "<br>")
document.write ("First link agreement is" +document.links[0].protocol+ "<br>")
document.write ("First link path is" +document.links[0].pathnamel+ "<br>")
document.write ("First link href is" +document.links[0].hrefl+ "<br>")
</script>
13. Change Links
<a href =http://www.microsoft.com>link</a>
<form name=form1>
<input Type=button name=button1 value= "Change link" onclick=document.links[0].href= ' http://www.sohu.com ' >
</form>
14. Using the History object
<form name=form1>
<input Type=button name=button1 value= "Back 2 page" Onclick=window.history.go ( -2) >
</form>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
