کامپیوتر و IT و اینترنتعلوم مهندسی

آموزش طراحی وب سایت، جلسه دوازدهم – جاوا اسکریپت 3

صفحه 1:
آموزش طراحی وب سایت جلسه دوازدهم 59 جاوا اسکریپت 3 تدريس طراحى وب براى اطلاعات بيشتر تماس بكيريد تاو شماره تماس: 09125773990 09371410986 پست الکترونیک TargetLearning@gmail.com

صفحه 2:
Web Design Training Java Scripts #3 Part 12 Author :Babak Tavatav

صفحه 3:
Array Object

صفحه 4:
he following code creates an Array object called myCars: 1: var myCars=new Array(); // regular array (add an optional integer "Saab"; // argument to control array's size) myCars[1]="Volvo"; myCars[2]="BMW"; 22 var myCars=new Array("Saab","Volvo","BMW"); // condensed array 3: var myCars=["Saab","Volvo","BMW"]; // literal array

صفحه 5:
٠ Access an Array * You can refer to a particular element in an array by referring to the name of the array and the index number. The index number starts at 0. ۰ The following code line: * document.write(myCars[0]);will result in the following output: Saab

صفحه 6:
join <html> <body> <script type="text/javascript"> var parents = ["Jani", "Tove"]; var children = ["Cecilie", "Lone"]; var family = parents.concat(children); document.write(family); </script> </body> </html>

صفحه 7:
<html> <body> <script type="text/javascript"> var parents ani", "Tove"]; var brothers Stale", "Kai var children = ["Cecilie", "Lone"]; var family = parents.concat(brothers, children); document.write(family); "Borge"]; </script> </body> </html>

صفحه 8:
JavaScript Math Object round() How to use round(). random() How to use random() to return a random number between 0 and 1. max() How to use max() to return the number with the highest value of two specified numbers. min() How to use min() to return the number with the lowest value of two specified numbers

صفحه 9:
JavaScript Image Maps An image-map is an image with clickable regions.

صفحه 10:

صفحه 11:
<html> <head> <script type="text/javascript"> function writeText(txt) { document.getElementByld("desc").innerH TML=txt; } </script> </head>

صفحه 12:
<body> <img sre usema| Planets" 45" height ="126" al planets.gif" width "#planetmap" /> <map name="planetmap"> <area shape ="rect" coords ="0,0,82,126" onMouseOver="writeText('The Sun and the gas giant planets like Jupiter are by far the largest objects in our Solar System. href ="sun.htm" target ="_blank" al Sun" /> <area shape ="circle" coords ="90,58,3" onMouseOver="writeText('The planet Mercury is very difficult to study from the Earth because it is always so close to the Sun.')" href ="mercur.htm" target ="_blank" alt="Mercury" /> <area shape ="circle" coords ="124,58,8" onMouseOver="writeText(Until the 1960s, Venus was often considered a twin sister to the Earth because Venus is the nearest planet to us, and because the two planets seem to share many characteristics. href ="venus.htm" target ="_blank" alt </map> "Venus" /> <p id="dese"></p> </body> </html>

صفحه 13:
JavaScript Timing Events With JavaScript, it is possible to execute some code after a specified time- interval. This is called timing events. It's very easy to time events in JavaScript. The two key methods that are used are: setTimeout() - executes a code some time in the future clearTimeout() - cancels the setTimeout()

صفحه 14:
setTimeout var t=setTimeout("javascript statement", milliseconds); The setTimeout() method returns a value - In the statement above, the value is stored in a variable called t. If you want to cancel this setTimeout(), you can refer to it using the variable name. The first parameter of setTimeout() is a string that contains a JavaScript statement. This statement could be a statement like “alert('5 seconds!')" or a call toa function, like "alertMsg()". The second parameter indicates how many milliseconds from now you want to execute the first parameter. Note: There are 1000 milliseconds in one second.

صفحه 15:
<html> <head> <script type="text/javascript"> function timedMsg() { var t=setTimeout("alert('! am displayed after 3 seconds!")", 3000); 7 </script> </head> <body> <form> <input type="button" value="Display alert box!" onClick="timedMsg()" /> </form> </body> </htmi>

صفحه 16:
count <html> head> “script type="textjavascript”> var e=0;, vart: Yar timer is_on=0; function timedcount() 1 document.getElementByid'txt) values; ‏ی‎ ‎{setTimeout("timedCount()",1000) 0) function doTimer() 1 if (timer ison) 1 mer is_on= timedcount(); 0 3 جاور ۳۵۵

صفحه 17:
<body> <form> <input type="button" value="Start count!" onClick="doTimer()"> <input type="text" id="txt"> </form> <p>Click on the button above. The input field will count forever, starting at 0.</p> </body> </html>

صفحه 18:
Custom counter

صفحه 19:
<html> <head> <script type="textjavascript”> var e=0; vart var timer is_on=0; function timedcount() 1 document getElementByld('txt').value=c: ‏بت‎ :000,"للاصامع عونا" امعد ۱۳ 1 function doTimer() 1 if (timer is on) 1 00000 ‏اکن‎ ‎0 ‎0 function stopcountt) 1 clearTimeouttt; timer is on=0 > iscript> <Ihead>

صفحه 20:
Custom counter <body> <form> "button" value="Start count!" onclick="doTimer()" /> text" id="txt" /> button" value="Stop count!" onclick="stopCount()" /> </form> <p> Click on the "Start count!" button above to start the timer. The input field will count forever, starting at 0. Click on the "Stop count!" button to stop the counting. Click on the "Start count!" button to start the timer again. </p> </body> </html>

صفحه 21:
The END

آموزش طراحی وب سایت جلسه دوازدهم – جاوا اسکریپت 3 تدریس طراحی وب برای اطالعات بیشتر تماس بگیرید تاو شماره تماس09125773990 : 09371410986 :پست الکترونیک ‏TargetLearning@gmail.com Web Design Training Java Scripts #3 Part 12 Author :Babak Tavatav Array Object he following code creates an Array object called myCars: 1: var myCars=new Array(); // regular array (add an optional integer myCars[0]="Saab"; // argument to control array's size) myCars[1]="Volvo"; myCars[2]="BMW"; 2: var myCars=new Array("Saab","Volvo","BMW"); // condensed array 3: var myCars=["Saab","Volvo","BMW"]; // literal array • Access an Array • You can refer to a particular element in an array by referring to the name of the array and the index number. The index number starts at 0. • The following code line: • document.write(myCars[0]);will result in the following output: Saab join <html> <body> <script type="text/javascript"> var parents = ["Jani", "Tove"]; var children = ["Cecilie", "Lone"]; var family = parents.concat(children); document.write(family); </script> </body> </html> <html> <body> <script type="text/javascript"> var parents = ["Jani", "Tove"]; var brothers = ["Stale", "Kai Jim", "Borge"]; var children = ["Cecilie", "Lone"]; var family = parents.concat(brothers, children); document.write(family); </script> </body> </html> JavaScript Math Object round() How to use round(). random() How to use random() to return a random number between 0 and 1. max() How to use max() to return the number with the highest value of two specified numbers. min() How to use min() to return the number with the lowest value of two specified numbers JavaScript Image Maps An image-map is an image with clickable regions. <html> <head> <script type="text/javascript"> function writeText(txt) { document.getElementById("desc").innerH TML=txt; } </script> </head> <body> <img src ="planets.gif" width ="145" height ="126" alt="Planets" usemap="#planetmap" /> <map name="planetmap"> <area shape ="rect" coords ="0,0,82,126" onMouseOver="writeText('The Sun and the gas giant planets like Jupiter are by far the largest objects in our Solar System.')" href ="sun.htm" target ="_blank" alt="Sun" /> <area shape ="circle" coords ="90,58,3" onMouseOver="writeText('The planet Mercury is very difficult to study from the Earth because it is always so close to the Sun.')" href ="mercur.htm" target ="_blank" alt="Mercury" /> <area shape ="circle" coords ="124,58,8" onMouseOver="writeText('Until the 1960s, Venus was often considered a twin sister to the Earth because Venus is the nearest planet to us, and because the two planets seem to share many characteristics.')" href ="venus.htm" target ="_blank" alt="Venus" /> </map> <p id="desc"></p> </body> </html> JavaScript Timing Events With JavaScript, it is possible to execute some code after a specified timeinterval. This is called timing events. It's very easy to time events in JavaScript. The two key methods that are used are: setTimeout() - executes a code some time in the future clearTimeout() - cancels the setTimeout() setTimeout var t=setTimeout("javascript statement",milliseconds); The setTimeout() method returns a value - In the statement above, the value is stored in a variable called t. If you want to cancel this setTimeout(), you can refer to it using the variable name. The first parameter of setTimeout() is a string that contains a JavaScript statement. This statement could be a statement like "alert('5 seconds!')" or a call to a function, like "alertMsg()". The second parameter indicates how many milliseconds from now you want to execute the first parameter. Note: There are 1000 milliseconds in one second. <html> <head> <script type="text/javascript"> function timedMsg() { var t=setTimeout("alert('I am displayed after 3 seconds!')",3000); } </script> </head> <body> <form> <input type="button" value="Display alert box!" onClick="timedMsg()" /> </form> </body> </html> count <html> <head> <script type="text/javascript"> var c=0; var t; var timer_is_on=0; function timedCount() { document.getElementById('txt').value=c; c=c+1; t=setTimeout("timedCount()",1000); } function doTimer() { if (!timer_is_on) { timer_is_on=1; timedCount(); } } </script> </head> <body> <form> <input type="button" value="Start count!" onClick="doTimer()"> <input type="text" id="txt"> </form> <p>Click on the button above. The input field will count forever, starting at 0.</p> </body> </html> Custom counter <html> <head> <script type="text/javascript"> var c=0; var t; var timer_is_on=0; function timedCount() { document.getElementById('txt').value=c; c=c+1; t=setTimeout("timedCount()",1000); } function doTimer() { if (!timer_is_on) { timer_is_on=1; timedCount(); } } function stopCount() { clearTimeout(t); timer_is_on=0; } </script> </head> Custom counter <body> <form> <input type="button" value="Start count!" onclick="doTimer()" /> <input type="text" id="txt" /> <input type="button" value="Stop count!" onclick="stopCount()" /> </form> <p> Click on the "Start count!" button above to start the timer. The input field will count forever, starting at 0. Click on the "Stop count!" button to stop the counting. Click on the "Start count!" button to start the timer again. </p> </body> </html> The END

51,000 تومان