http://niloblog.n63.ir/images/6me63v66fs28ll1lktm.jpg

وبلاگ پژوهشی - آموزشی وب سایت، شبکه های کامپیوتری

طراحی سایت ، برنامه نویسی وب سایت، تکنولوژی های سیسکو و مایکروسافت

وبلاگ پژوهشی - آموزشی وب سایت، شبکه های کامپیوتری

طراحی سایت ، برنامه نویسی وب سایت، تکنولوژی های سیسکو و مایکروسافت

مسائل جاوا اسکریپت

يكشنبه, ۳۱ فروردين ۱۳۹۳، ۰۷:۰۶ ب.ظ



1 - به کمک آرایه ها و تابع ها صفحه ای ایجاد می کنیم که با فشردن دکمه previwe جمله های ریخته شده در آرایه

 

 را در یک textarea به ما نمایش دهد

 

< script >

var sen=new Array(3);

sen[0]=" هر وقت تردید کردی، مطمئن باش که شکست می خوری "

sen[1]=" بزرگترین رمز موفقیت، با هم بودن است "

sen[2]=" آنسوی ناکامی ها، خدایی است که داشتنش جبران همه نداشته هاست "

function calls()

{

document.form1.t1.value=sen[0]+ "\n" + "\n" +sen[1] + "\n" + "\n"

+sen[2]

}

< /script >

< body >

< form name="form1" >

< textarea rows=8 cols=70 name="t1" > < /textarea > < p/ >

< input type="button" name="butt1" value="Previwe" onClick="calls()" / >

< input type="reset" name="r1" value="clean" / >

< /form >

< /body >


2 - در این مثال صفحه ای ایجاد می کنیم که در آن از چند متد شیء string استفاده می شود :

 

var str1=new String("This Is a Test For String Object");

document.write("bold:" +str1.bold() + "< p >");

document.write("toUpperCase:" +str1.toUpperCase() + "< p >");

document.write("toLowerCase:" +str1.toLowerCase() + "< p >");

document.write("search:" +str1.search("String") + "< p >");

document.write("slice:" +str1.slice(19,32) + "< p >");

document.write("length:" +str1.length );

 

 

3 – وارد کردن رمز عبور :

<script>

Var username="test"

Var username=promt("please insert pass")

If(username=="test")

{

Document.write("welcome")

}

Else

{

Document.write("error")

}

</script>

 

 

4 – فاکتوریل اعداد 1 تا 10 :

<script>

Var fact=1;

For(i=1;i<11;i++)

{

Fact*=I;

Document.write(i+"!="+fact);

Document.write('<br>')

}

</script>

 

5 –مجموع اعداد 1 تا 10

 

<script>

Var i=0;

Var result=0;

Var status=true;

Document.write("0");

While(status)

{

I++;

Document.write("++I");

Result+=I;

If(i==10)

Statuse=false;

}

Document.write("="+result);

</script>

6 – شمارش معکوس :

 

<script>

Var userenty=promt("insert number");

Var x=userentry;

Do

{

Document.write(x+"<br>");

x--;

} while(x>0);

</script>

 

7 –تغییر رنگ زمینه :

<html>

<head>

<title>test</title>

<script>

Function defaultcolor="green";

}

Document.bgcolor="green";

</script>

</head>

<body>

<script>

Defaultcolor();

</script>

</body>

</html>

 

8 – ایجاد لینک :

<html>

<body>

<p>

<a href="default.asp">HTML Tutorial</a> This is a link to a page on this website.

</p>

<p>

<a href="http://www.google.com/">Google</a> This is a link to a website on the World Wide Web.

</p>

</body>

</html>

 

 

9 – لینک به صفحه :

<html>

<body>

<p>

<a href="#C4">See also Chapter 4.</a>

</p>

<h2>Chapter 1</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 2</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 3</h2>

<p>This chapter explains ba bla bla</p>

<h2><a name="C4">Chapter 4</a></h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 5</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 6</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 7</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 8</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 9</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 10</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 11</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 12</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 13</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 14</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 15</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 16</h2>

<p>This chapter explains ba bla bla</p>

<h2>Chapter 17</h2>

<p>This chapter explains ba bla bla</p>

</body>

</html>

 

برای مثال می خواهیم با کلیک بر روی یک دکمه تابع فراخوانی شود و یک پیام نمایش داده شود :                  - 10

  funA()  function

{alert("function")}

</script>

<form>

<" funA() "input type="button"  value="Close"   onClick= >

</form>

</body>

 

11- استفاده از دستور promptبرای دریافت داده از کاربر:

<script>

var msg=prompt("Please enter Name");

 alert ("Welcom to screen" + msg);

</script>

 

12 - برای قرار دادن مقدار پیش فرض در کادر پیام، از پارامتر دوم دستور prompt استفاده می کنیم.

 

<script>

 

var msg= prompt("Please enter Name", "Ali");

alert ("Welcom to Screen" + msg);

 

</script>

 

13 - می خواهیم صفحه ای ایجادکنیم که پس از ورود کاربر به آن صفحه، کادری به او نمایش دهیم و از او بپرسیم ” آیا

 

شما مایلید رنگ صفحه را تغییر دهید؟ ” و با انتخاب دکمه ok توسط کاربر، رنگ زمینه صفحه تغییر کند و با انتخاب

 

 cancel رنگ زمینه به همان صورت سفید باقی بماند.

<script>

var c=confirm("do you want change background color? ")

if (c==true)

{ ;"   window.document.bgColor=" lavender}

else {  document.bgColor="white" };

</script>

 

14 - مثال: در این مثال صفحه ای طراحی می کنیم که با یک پیام از کاربر می خواهد که یکی از حروف نام برده شده را

 

وارد کند سپس حرف را تشخیص داده وبا توجه به انتخاب کاربر، رنگ متن را تغییر دهد.

 

<script>

var colors=prompt("please enter  R  or  B  or  Y or m","m );

) switch (colors

{

case "R": document.fgColor="Red";

braek;

case "B": document.fgColor="Blue ";

braek;

case "M": document.fgColor="Magenta ";

braek;

case "Y": document.fgColor="Yellow";

braek;

default: document.fgColor="Green; "

}

</script>

15 – مثالی برای چاپ مشخصات ساعت و تاریخ :

var D = new Date();

document.write(D+"<p>");

document.write( "Year:"    +    "&nbsp"  +   D.getYear()+"<br>");

document.write("Month:"   +    "&nbsp"  +   D.getMonth ()+"<br>");

document.write("Date:"     +     "&nbsp"  +  D.getDate ()+"<br>");

document.write("Day:"      +     "&nbsp"  +  D.getDay ()+"<br>");

document.write("Hours:"   +     "&nbsp"  +   D.getHours ()+"<br>");

document.write( "Minute:"  +    "&nbsp"  +   D.getMinutes ()+"<br>");

document.write("Seconds:" +    "&nbsp"  +   D.getSeconds ()+"<br>");

document.write("LocalString:" + "&nbsp"  +  D.toLocaleString 

()+"<br>");

document.write("Full Date:"   "&nbsp"  +  D.toLocaleDateString 

()+"<br>");

document.write("Full Time:"   "&nbsp"  +  D.toLocaleTimeString() );

 

 

16 - در اینجا ما اطلاعات زمانی رو از سیستم گرفتیم و فقط آنها را نمایش دادیم. اما ما میتونیم دستورات رو دستکاری

 

کنیم. یعنی خودمون اطلاعات رو برای این شیء مشخص کنیم. به مثال زیر توجه کنید:

 

var n = new Date(2009 , 10 , 9 , 11 , 20 , 50 );

document.write (n+"<p>");

document.write("Year:"     +  n.getYear() +"<br>");

document.write("Month:"   +  n.getMonth() +"<br>");

document.write("Date:"     +  n.getDate() +"<br>");

document.write("Hours:"    +  n.getHours() +"<br>");

document.write("Minute:"   +  n.getMinutes() +"<br>");

document.write("Second:"  +  n.getSeconds() );

 

 

17 – مثالی دیگر برای نمایش روز :

<script language="javascript" type="text/javascript">

var d = new Date ()
var weekday = d.getDay ()

switch ( weekday )
 {
case 0 :
          document.write ("Sunday")
          break
case 1:
         document.write ("Monday")
          break
case 2:
         document.write ("Tuesday")
         break
case 3:
         document.write ("Wednesday")
         break
case 4:
         document.write ("Thursday")
          break
case 5:
         document.write ("Friday")
         break
default:
         document.write ("Saturday")
}
</script>

 

 

18 – مثالی ساده  برای چاپ اعداد :

 

<script language="javascript" type="text/javascript">

for ( i = 0; i <= 10; i++ )
{
document.write ( " Number " + i + "<br />")
}
</script>

 

19 – مثالی برای پیغام صبح به خیر :

<script language="javascript" type="text/javascript">
var d = new Date()
var t = d.getHours()
if ( t < 10 )
{
document.write ( "<b> Good morning </b>")
}
</script>

20 –ادامه مثال بالا برای اوقات روز :

f ( t <= 10  ) {
document.write ( "<b> Good morning </b>" ) 
}
else if ( t > 10 && t < 13 ) {
document.write ( "<b> Hello friends </b>" )
}
else if ( t >= 13 && t < 18 ) {
document.write ( "<b> Good afternoon </b>" )
}
else {
document.write ( "<b> Good evening </b>" )
}

 

 

21 – خوش آمدگویی به سایت :

<html>

<head>

<script language="javascript" type="text/javascript">

alert("Welcome to my site")

</script>

</head>

<body>

<h1>

<!-- hide script from old browsers -->

<!--this is on example of a long JavaScript comment-->

<script language="javascript" type="text/javascript">

document.write("KKR")

//end hiding script from old browsers -->

</script>

</h1>

</body>

</html>

22 - در این قسمت یک برنامه ساده را با جاوا اسکریپت طراحی کرده ایم . این برنامه از طریق 2 کادر متن ، دو عدد را

 

به عنوان ورودی دریافت کرده و عدد اول را به توان عدد دوم می رساند .

 

< script type="text/javascript" >
  function multiple ( )
    {
      var sum = 1 ;
      var n = Num1.value ;
      for ( var i = Num2.value ; i > 0 ; i-- )
       {
         sum = sum * n ;
       }

      document.write ( sum ) ;
    } 
< /script >

< input type="text" id="Num1" />
< input type="text" id="Num2" />
< input type="button" id="Btnclick" value=" Click for Multipe" onclick="multiple( )" / >

23 – ارسال ایمیل :

<html>

<body>

<p>

This is an email link:

<a href="mailto:someone@example.com?Subject=Hello%20again">

Send Mail</a>

</p>

<p>

<b>Note:</b> Spaces between words should be replaced by %20 to ensure that the browser will display the text properly.

</p>

</body>

</html>

 

 

24 – آوردن عکس

<p>

An image:

<img src="smiley.gif" alt="Smiley face" width="32" height="32" />

</p>

 

25 – تصویر متحرک :

<p>

A moving image:

<img src="hackanm.gif" alt="Computer man" width="48" height="48" />

</p>

 

26  - ایجاد جدول با 2 سطر و 2 ستون

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>

27 – تغییر border  جدول

 

<h4>With a thick border:</h4

<table border="8">

<tr>

  <td>First</td>

  <td>Row</td>

</tr>  

<tr>

  <td>Second</td>

  <td>Row</td>

</tr>

</table>

 

28 – دکمه ای که با کلیک روی آن عمی خاصی انجام می شود :

<html>
<head>
<script type="text/javascript">
function show_alert()
{
alert("I am an alert box!");
}
</script>
</head>
<body>

<input type="button" onclick="show_alert()" value="Show alert box" />

</body>
</html>

 

 

 

29 – نمایش پیغام با کلیک بر روی دکمه :

<html>
<head>
<script type="text/javascript">
function show_confirm()
{
var r=confirm("Press a button");
if (r==true)
  {
  alert("You pressed OK!");
  }
else
  {
  alert("You pressed Cancel!");
  }
}
</script>
</head>
<body>

<input type="button" onclick="show_confirm()" value="Show confirm box" />

</body>
</html>

 

30 – کلیک بر روی دکمه و دریافت نام به وسیله ی promt  از کاربر :

<html>
<head>
<script type="text/javascript">
function show_prompt()
{
var name=prompt("Please enter your name","Harry Potter");
if (name!=null && name!="")
  {
  document.write("Hello " + name + "! How are you today?");
  }
}
</script>
</head>
<body>
<input type="button" onclick="show_prompt()" value="Show prompt box" />
</body>
</html>

 

31  - چاپ اعضای یک آرایه ی 4 عضوی :

<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>

 

32 – چاپ اعضای یک آرایه ی 6 عضوی با روشی دیگر :

 

<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>

 

33 – چاپ اعضای آرایه کنار هم :

<html>

<body>

 

<script type="text/javascript">

 

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write(fruits.join() + "<br />");

document.write(fruits.join("+") + "<br />");

document.write(fruits.join(" and "));

 

</script>

 

</body>

</html>

 

 

34 – چاپ عناصر آرایه با چند روش :

<html>

<body>

<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write(fruits.pop() + "<br />");

document.write(fruits + "<br />");

document.write(fruits.pop() + "<br />");

document.write(fruits);

</script>

</body>

</html>

 

35 – چاپ طول آرایه و عناصر آن :

<html>

<body>

<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write(fruits.push("Kiwi") + "<br />");

document.write(fruits.push("Lemon","Pineapple") + "<br />");

document.write(fruits);

</script>

 

</body>

</html>

 

36 – منظم کردن عناصر آرایه :

<html>

<body>

<script type="text/javascript">

function sortNumber(a, b)

{

return a - b;

}

 

var n = ["10", "5", "40", "25", "100", "1"];

document.write(n.sort(sortNumber));

</script>

</body>

</html>

37 –منظم کردن نزولی آرایه :

<html>

<body>

<script type="text/javascript">

function sortNumber(a, b)

{

return b - a;

}

 

var n = ["10", "5", "40", "25", "100", "1"];

document.write(n.sort(sortNumber));

</script>

 

</body>

</html>

 

38 – اضافه کردن عنصر به آرایه :

<html>

<body>

<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write("Removed: " + fruits.splice(2,0,"Lemon") + "<br />");

document.write(fruits);

</script>

</body>

</html>

 

39 – کاربرد متد to string

<html>

<body>

<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write(fruits.toString());

</script>

</body>

</html>

 

40 – اضافه کردن چند عنصر دیگر :

<html>

<body>

<script type="text/javascript">

var fruits = ["Banana", "Orange", "Apple", "Mango"];

document.write(fruits.unshift("Kiwi") + "<br />");

document.write(fruits.unshift("Lemon","Pineapple") + "<br />");

document.write(fruits);

</script>

<p><b>Note:</b> The unshift() method does not work properly in Internet Explorer, it only returns undefined!</p>

</body>

</html>

 

41 – تعریف متغیر boolean

var myBoolean=new Boolean(1);
var myBoolean=new Boolean(true);
var myBoolean=new Boolean("true");
var myBoolean=new Boolean("false");
var myBoolean=new Boolean("Richard");

 

 

42 – جذر گرفتن :

var pi_value=Math.PI;
var sqrt_value=Math.sqrt(16);

 

 

 

 

 

43 – گرد کردن عدد :

document.write(Math.round(4.7));

 

44 – چاپ عدد تصادفی :

document.write(Math.random());

 

45 - حذف بخش اعشار :

document.write(Math.floor(Math.random()*11));

46 – روش استفاده از توابع ریاضی :

Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E

 

 

47 – گذاشتن لودینگ در صفحه :

<SCRIPT language=VBScript>

   <!--

   Dim Bar, Line, SP

   Bar = 0

   Line = "|"

   sP = 200

      Function Window_onLoad()

     Bar = 95

     sP = 10

   END Function

  

   Function Count()

   If Bar < 100 Then

      Bar = Bar + 1

      Window.Status = "Ljava.mihanblog.com => plz Wait 4 Load : " & Bar & "%" & " " & String(Bar, Line)

      setTimeout "Count()", SP

   Else

      Window.Status = ""

      Document.Body.Style.Display = ""

   End If

   End Function

      Call Count()

   -->

</SCRIPT>

 

 

48 – بسته شدن وبلاگ بعد از 5 ثانیه :

<SCRIPT LANGUAGE="JavaScript">

<!--//hiding it

setTimeout("window.close();", 5);

//end hiding it-->

     </SCRIPT></body>

</html>

 

 

49 –دریافت نام کاربری و خوش آمدگویی

<HEAD>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<SCRIPT LANGUAGE="Javascript">

var namePrompt = prompt("ببخشید اسم شریفتون؟","");

function dispname (namePrompt) {

document.write(""+namePrompt+"");

}

</SCRIPT>

<BODY>

<CENTER>

<SCRIPT LANGUAGE="Javascript">

document.write("<font size=3 color=red> خوش امدی عزیزم, ");

dispname(namePrompt);

document.write("!</font>");

</SCRIPT>

</CENTER></body>

</html>

</body>

</html>

 

 

50 – پاراگراف :

<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>
<hr />
<p>This is a paragraph</p>

51 –انتخاب بزرگترین عضو :

<html>

<body>

<script type="text/javascript">

document.write(Math.max(5,10) + "<br />");

document.write(Math.max(0,150,30,20,38) + "<br />");

document.write(Math.max(-5,10) + "<br />");

document.write(Math.max(-5,-10) + "<br />");

document.write(Math.max(1.5,2.5));

</script>

</body>

</html>

 

 

52 –انتخاب کوچکترین عضو :

<html>

<body>

<script type="text/javascript">

document.write(Math.min(5,10) + "<br />");

document.write(Math.min(0,150,30,20,38) + "<br />");

document.write(Math.min(-5,10) + "<br />");

document.write(Math.min(-5,-10) + "<br />");

document.write(Math.min(1.5,2.5));

</script>

</body>

</html>

53 –گرد کردن عدد :

<html>

<body>

<script type="text/javascript">

document.write(Math.round(0.60) + "<br />");

document.write(Math.round(0.50) + "<br />");

document.write(Math.round(0.49) + "<br />");

document.write(Math.round(-4.40) + "<br />");

document.write(Math.round(-4.60));

 

</script>

</body>

</html>

 

 

 

54 – شی متحرک :

<html>
<body>
<script type="text/javascript">
document.write("Browser CodeName: " + navigator.appCodeName);
document.write("<br /><br />");
document.write("Browser Name: " + navigator.appName);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);
document.write("<br /><br />");
document.write("Cookies Enabled: " + navigator.cookieEnabled);
document.write("<br /><br />");
document.write("Platform: " + navigator.platform);
document.write("<br /><br />");
document.write("User-agent header: " + navigator.userAgent);
</script>
</body>
</html>

 

 

55 –انتخاب بزرگترین عضو :

<html>

<body>

<script type="text/javascript">

document.write(Math.max(5,10) + "<br />");

document.write(Math.max(0,150,30,20,38) + "<br />");

document.write(Math.max(-5,10) + "<br />");

document.write(Math.max(-5,-10) + "<br />");

document.write(Math.max(1.5,2.5));

</script>

</body>

</html>

 

 

56 –انتخاب کوچکترین عضو :

<html>

<body>

<script type="text/javascript">

document.write(Math.min(5,10) + "<br />");

document.write(Math.min(0,150,30,20,38) + "<br />");

document.write(Math.min(-5,10) + "<br />");

document.write(Math.min(-5,-10) + "<br />");

document.write(Math.min(1.5,2.5));

</script>

</body>

</html>

57 –گرد کردن عدد :

<html>

<body>

<script type="text/javascript">

document.write(Math.round(0.60) + "<br />");

document.write(Math.round(0.50) + "<br />");

document.write(Math.round(0.49) + "<br />");

document.write(Math.round(-4.40) + "<br />");

document.write(Math.round(-4.60));

 

</script>

</body>

</html>

 

 

 

58 – شی متحرک :

<html>
<body>
<script type="text/javascript">
document.write("Browser CodeName: " + navigator.appCodeName);
document.write("<br /><br />");
document.write("Browser Name: " + navigator.appName);
document.write("<br /><br />");
document.write("Browser Version: " + navigator.appVersion);
document.write("<br /><br />");
document.write("Cookies Enabled: " + navigator.cookieEnabled);
document.write("<br /><br />");
document.write("Platform: " + navigator.platform);
document.write("<br /><br />");
document.write("User-agent header: " + navigator.userAgent);
</script>
</body>
</html>

موافقین ۰ مخالفین ۰ ۹۳/۰۱/۳۱
محسن احدی آتشگاه

نظرات  (۱)

سلام، وبلاگ خوبی دارید.واقعا وبلاگ تکی داری! دوست دارم به عنوان یه کارشناس نظرتو در مورد وبلاگم بدونم

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی