Part-B Web Design Lab JavaScript WEB DESIGN LAB PART-B JAVA SCRIPT LABORATORY MANUAL FOR 3RD SEM IS AND CS (2011-2012) BY MISS. SAVITHA R LECTURER INFORMATION SCIENCE DEPTATMENT GOVERNMENT POLYTECHNIC GULBARGA FOR ANY FEEDBACK CONTACT TO EMAIL: savitharamu@gmail.com GOVT.POLYTECHNIC BIJAPUR 1
Part-B Web Design Lab JavaScript PROGRAM 1 JAVA SCRIPT TO PERFORM ALL ARITHMATIC OPERATION <html> <head> <title> Arithmatic Operation </title> <script type="text/javascript"> var n1,n2,r; function add() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1+n2; document.myform.result.value=r; } function sub() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1-n2; document.myform.result.value=r; } function mul() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1*n2; document.myform.result.value=r; } function divide() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1/n2; document.myform.result.value=r; } GOVT.POLYTECHNIC BIJAPUR 2
Part-B Web Design Lab JavaScript </script> </head> <body> <form name="myform"> <h1 align="center"> Arithmatic Operations</h1> <hr color="red"> <center><u>Enter a number in each text box </u><br><br> Number 1:<input type="text" name="n1" value=""> <br><br> Number 2:<input type="text" name="n2" value=""> <br><br> <input type="button" value="Add" onClick="add()"> <input type="button" value="Subtract" onClick="sub()"> <input type="button" value="Multiply" onClick="mul()" > <input type="button" value="Divide" onClick="divide()"><br><br> <font color="red">Result is: <input type="text" name="result" value=""></center></font> </form> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 3
Part-B Web Design Lab JavaScript GOVT.POLYTECHNIC BIJAPUR 4
Part-B Web Design Lab JavaScript PROGRAM 2 JAVA SCRIPT TO CHECK WHETHER A GIVEN NUMBER IS PRIME OR NOT <html> <head> <title> To check for a prime number </title> <script type="text/javascript"> function p() { var n,i,flag=true; n=document.myform.n.value; n=parseInt(n) for(i=2;i<=n-1;i++) if(n%i==0) { flag=false; break; } if(flag==true) alert(n + " is prime"); else alert(n + " is not prime"); } </script></head> <body> <center> <h1> To check whether a given number is prime or not </h1> <hr color="red"> <form name="myform"> Enter the number: <input type="text" name=n value=""><br><br> <input type="button" value="Check" onClick="p()"><br> </center> </form> </body> </html> GOVT.POLYTECHNIC BIJAPUR 5
Part-B Web Design Lab JavaScript OUTPUT GOVT.POLYTECHNIC BIJAPUR 6
Part-B Web Design Lab JavaScript PROGRAM 3 JAVA SCRIPT TO SEARCH AN ELEMENT IN AN ARRAY OF SIZE “N” <html> <head> <script type="text/javascript"> function show_prompt() { var n=document.frm.text1.value; if( n == "") { alert("Please enter the array size"); } else { var a=new Array(); var temp; for(i=0;i<n;i++) { var num=prompt("Please enter a number"," "); document.frm.arrayTxt.value=document.frm.arrayTxt.value+num+"n"; a[i]=parseInt(num); } var flag=0; var search=prompt("Enter the element to be searched ",""); for(i=0;i<n;i++) if(a[i]==search) { flag=1; p=i+1; } if(flag==1) alert("Element " + search + " found at position " +p); else alert("Sorry!, Element " + search + " not found "); document.frm.text1.value=""; document.frm.arrayTxt.value=""; } } </script> </head> <body> GOVT.POLYTECHNIC BIJAPUR 7
Part-B Web Design Lab JavaScript <form name="frm"> <center> <h3>To find an element in a given array </h3> <hr color="red"> Enter the array size : <input type="text" name="text1"><br><br> <input type="button" onclick="show_prompt()" value="Submit"> <br><br> <textarea name="arrayTxt" rows="10" cols="4"></textarea><br> </center> </form></body></html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 8
Part-B Web Design Lab JavaScript GOVT.POLYTECHNIC BIJAPUR 9
Part-B Web Design Lab JavaScript PROGRAM 4 JAVA SCRIPT TO ILLUSTRATE A SUBROUTINE. <html> <head> <script type="text/javascript"> function myfunction() { document.write("<h1 align=center> <font color=red> Hello !!! This Message is From The SubRoutine </font> </h1>"); } </script> </head> <body> <h1 align="center"> Subroutine Example </h1> <hr color="red"> <center> <form> <input type="button" value="Cal Subroutine " onClick="myfunction()"); </from> </center> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 10
Part-B Web Design Lab JavaScript PROGRAM 5 JAVA SCRIPT TO COMPUTE THE GCD OF 2 NUMBERS USING FUNCTION. <html> <head> <script type="text/javascript"> function gcd() { var x,y; x=parseInt(document.myform.n1.value); y=parseInt(document.myform.n2.value); while(x!=y) { if(x>y) x=x-y; else y=y-x; } document.myform.result.value=x; } </script> </head> <body> <h1 align="center"> Program to calculate gcd of two numbers </h1> <hr color="red"> <center> Enter two numbers : <form name="myform"> Number 1 : <input type="text" name="n1" value=""> <br> <br> Number 2 : <input type="text" name="n2" value=""> <br> <br> <input type="button" value="Get GCD" onClick="gcd()"> <br> <br> GCD is : <input type="text" name="result" value=""> </form> </body> </html> GOVT.POLYTECHNIC BIJAPUR 11
Part-B Web Design Lab JavaScript OUTPUT GOVT.POLYTECHNIC BIJAPUR 12
Part-B Web Design Lab JavaScript PROGRAM 6 JAVA SCRIPT TO FIND THE SECOND LARGEST NUMBER IN AN ARRAY. <html> <head> <script type="text/javascript"> function show_prompt() { var n=document.frm.text1.value; if( n == "") { alert("Please enter the array size"); } else { var a=new Array(); var temp; for(i=0;i<n;i++) { var num=prompt("Please enter a number"," "); document.frm.arrayTxt.value=document.frm.arrayTxt.value+num+"n"; a[i]=parseInt(num); } var large=a[0]; for(i=1;i<n;i++) if(a[i]>large) large=a[i]; var slarge=a[0]; for(i=1;i<n;i++) if(a[i]>slarge && a[i]!=large) slarge=a[i]; alert("The second largest element in the given array is "+slarge); document.frm.text1.value=""; document.frm.arrayTxt.value=""; } } </script> </head> <body> <form name="frm"> <center> <h1>To find second largest element in a given array </h1> <hr color=”red”> Enter the array size : <input type="text" name="text1"><br><br> <input type="button" onClick="show_prompt()" value="Submit"> <br><br> <textarea name="arrayTxt" rows="10" cols="4"></textarea><br> GOVT.POLYTECHNIC BIJAPUR 13
Part-B Web Design Lab JavaScript </center> </form> </body> </html> OUTPUT . GOVT.POLYTECHNIC BIJAPUR 14
Part-B Web Design Lab JavaScript PROGRAM 7 JAVA SCRIPT TO CHECK WHETHER THE GIVEN INTEGER IS PALINDROME OR NOT <html> <head> <script type="text/javascript"> function isPalindrome() { var num=document.frm.text1.value; if(num == "") { alert("Please enter the number"); } else { var digit; var rev = 0; var n = num; while (num!=0) { digit = num% 10; rev = (rev * 10) + digit; num = num / 10; num = parseInt(num); } if( n == rev) alert(" Integer is palindrome "); else alert(" Integer is not palindrome "); document.frm.text1.value=""; } } </script> </head> <body> <form name="frm"> <h1 align="center">To check whether a number is palindrome or not</h1> <hr color="red"> <center> Enter a number: <input type="text" name="text1"> <br><br> <input type="button" value="Check Palindrome" onclick="isPalindrome()"> GOVT.POLYTECHNIC BIJAPUR 15
Part-B Web Design Lab JavaScript </center> </form> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 16
Part-B Web Design Lab JavaScript PROGRAM 8 JAVA SCRIPT TO ILLUSTRATE DIFFERENT IN-BUILT STRING FUNCTIONS. <html> <body> <script type="text/javascript"> var str="Hello World"; document.write("<center>"); document.write("<h1> Example for String Functions </h1> "); document.write("<hr color=red>"); document.write(str.big()+"<br>"); document.write(str.small()+"<br>"); document.write(str.bold()+"<br>"); document.write(str.italics()+"<br>"); document.write(str.fixed()+"<br>"); document.write(str.strike()+"<br>"); document.write(str.sup()+"<br>"); document.write(str.sub()+"<br>"); document.write(str.blink()+"<br>"); document.write(str.link("p1.html")+"<br>"); document.write(str.fontcolor("green")+"<br>"); document.write(str.fontsize(6)+"<br>"); document.write("</center>"); </script> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 17

Webdesing lab part-b__java_script_

  • 1.
    Part-B Web DesignLab JavaScript WEB DESIGN LAB PART-B JAVA SCRIPT LABORATORY MANUAL FOR 3RD SEM IS AND CS (2011-2012) BY MISS. SAVITHA R LECTURER INFORMATION SCIENCE DEPTATMENT GOVERNMENT POLYTECHNIC GULBARGA FOR ANY FEEDBACK CONTACT TO EMAIL: savitharamu@gmail.com GOVT.POLYTECHNIC BIJAPUR 1
  • 2.
    Part-B Web DesignLab JavaScript PROGRAM 1 JAVA SCRIPT TO PERFORM ALL ARITHMATIC OPERATION <html> <head> <title> Arithmatic Operation </title> <script type="text/javascript"> var n1,n2,r; function add() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1+n2; document.myform.result.value=r; } function sub() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1-n2; document.myform.result.value=r; } function mul() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1*n2; document.myform.result.value=r; } function divide() { n1=document.myform.n1.value; n2=document.myform.n2.value; n1=parseFloat(n1); n2=parseFloat(n2); r=n1/n2; document.myform.result.value=r; } GOVT.POLYTECHNIC BIJAPUR 2
  • 3.
    Part-B Web DesignLab JavaScript </script> </head> <body> <form name="myform"> <h1 align="center"> Arithmatic Operations</h1> <hr color="red"> <center><u>Enter a number in each text box </u><br><br> Number 1:<input type="text" name="n1" value=""> <br><br> Number 2:<input type="text" name="n2" value=""> <br><br> <input type="button" value="Add" onClick="add()"> <input type="button" value="Subtract" onClick="sub()"> <input type="button" value="Multiply" onClick="mul()" > <input type="button" value="Divide" onClick="divide()"><br><br> <font color="red">Result is: <input type="text" name="result" value=""></center></font> </form> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 3
  • 4.
    Part-B Web DesignLab JavaScript GOVT.POLYTECHNIC BIJAPUR 4
  • 5.
    Part-B Web DesignLab JavaScript PROGRAM 2 JAVA SCRIPT TO CHECK WHETHER A GIVEN NUMBER IS PRIME OR NOT <html> <head> <title> To check for a prime number </title> <script type="text/javascript"> function p() { var n,i,flag=true; n=document.myform.n.value; n=parseInt(n) for(i=2;i<=n-1;i++) if(n%i==0) { flag=false; break; } if(flag==true) alert(n + " is prime"); else alert(n + " is not prime"); } </script></head> <body> <center> <h1> To check whether a given number is prime or not </h1> <hr color="red"> <form name="myform"> Enter the number: <input type="text" name=n value=""><br><br> <input type="button" value="Check" onClick="p()"><br> </center> </form> </body> </html> GOVT.POLYTECHNIC BIJAPUR 5
  • 6.
    Part-B Web DesignLab JavaScript OUTPUT GOVT.POLYTECHNIC BIJAPUR 6
  • 7.
    Part-B Web DesignLab JavaScript PROGRAM 3 JAVA SCRIPT TO SEARCH AN ELEMENT IN AN ARRAY OF SIZE “N” <html> <head> <script type="text/javascript"> function show_prompt() { var n=document.frm.text1.value; if( n == "") { alert("Please enter the array size"); } else { var a=new Array(); var temp; for(i=0;i<n;i++) { var num=prompt("Please enter a number"," "); document.frm.arrayTxt.value=document.frm.arrayTxt.value+num+"n"; a[i]=parseInt(num); } var flag=0; var search=prompt("Enter the element to be searched ",""); for(i=0;i<n;i++) if(a[i]==search) { flag=1; p=i+1; } if(flag==1) alert("Element " + search + " found at position " +p); else alert("Sorry!, Element " + search + " not found "); document.frm.text1.value=""; document.frm.arrayTxt.value=""; } } </script> </head> <body> GOVT.POLYTECHNIC BIJAPUR 7
  • 8.
    Part-B Web DesignLab JavaScript <form name="frm"> <center> <h3>To find an element in a given array </h3> <hr color="red"> Enter the array size : <input type="text" name="text1"><br><br> <input type="button" onclick="show_prompt()" value="Submit"> <br><br> <textarea name="arrayTxt" rows="10" cols="4"></textarea><br> </center> </form></body></html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 8
  • 9.
    Part-B Web DesignLab JavaScript GOVT.POLYTECHNIC BIJAPUR 9
  • 10.
    Part-B Web DesignLab JavaScript PROGRAM 4 JAVA SCRIPT TO ILLUSTRATE A SUBROUTINE. <html> <head> <script type="text/javascript"> function myfunction() { document.write("<h1 align=center> <font color=red> Hello !!! This Message is From The SubRoutine </font> </h1>"); } </script> </head> <body> <h1 align="center"> Subroutine Example </h1> <hr color="red"> <center> <form> <input type="button" value="Cal Subroutine " onClick="myfunction()"); </from> </center> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 10
  • 11.
    Part-B Web DesignLab JavaScript PROGRAM 5 JAVA SCRIPT TO COMPUTE THE GCD OF 2 NUMBERS USING FUNCTION. <html> <head> <script type="text/javascript"> function gcd() { var x,y; x=parseInt(document.myform.n1.value); y=parseInt(document.myform.n2.value); while(x!=y) { if(x>y) x=x-y; else y=y-x; } document.myform.result.value=x; } </script> </head> <body> <h1 align="center"> Program to calculate gcd of two numbers </h1> <hr color="red"> <center> Enter two numbers : <form name="myform"> Number 1 : <input type="text" name="n1" value=""> <br> <br> Number 2 : <input type="text" name="n2" value=""> <br> <br> <input type="button" value="Get GCD" onClick="gcd()"> <br> <br> GCD is : <input type="text" name="result" value=""> </form> </body> </html> GOVT.POLYTECHNIC BIJAPUR 11
  • 12.
    Part-B Web DesignLab JavaScript OUTPUT GOVT.POLYTECHNIC BIJAPUR 12
  • 13.
    Part-B Web DesignLab JavaScript PROGRAM 6 JAVA SCRIPT TO FIND THE SECOND LARGEST NUMBER IN AN ARRAY. <html> <head> <script type="text/javascript"> function show_prompt() { var n=document.frm.text1.value; if( n == "") { alert("Please enter the array size"); } else { var a=new Array(); var temp; for(i=0;i<n;i++) { var num=prompt("Please enter a number"," "); document.frm.arrayTxt.value=document.frm.arrayTxt.value+num+"n"; a[i]=parseInt(num); } var large=a[0]; for(i=1;i<n;i++) if(a[i]>large) large=a[i]; var slarge=a[0]; for(i=1;i<n;i++) if(a[i]>slarge && a[i]!=large) slarge=a[i]; alert("The second largest element in the given array is "+slarge); document.frm.text1.value=""; document.frm.arrayTxt.value=""; } } </script> </head> <body> <form name="frm"> <center> <h1>To find second largest element in a given array </h1> <hr color=”red”> Enter the array size : <input type="text" name="text1"><br><br> <input type="button" onClick="show_prompt()" value="Submit"> <br><br> <textarea name="arrayTxt" rows="10" cols="4"></textarea><br> GOVT.POLYTECHNIC BIJAPUR 13
  • 14.
    Part-B Web DesignLab JavaScript </center> </form> </body> </html> OUTPUT . GOVT.POLYTECHNIC BIJAPUR 14
  • 15.
    Part-B Web DesignLab JavaScript PROGRAM 7 JAVA SCRIPT TO CHECK WHETHER THE GIVEN INTEGER IS PALINDROME OR NOT <html> <head> <script type="text/javascript"> function isPalindrome() { var num=document.frm.text1.value; if(num == "") { alert("Please enter the number"); } else { var digit; var rev = 0; var n = num; while (num!=0) { digit = num% 10; rev = (rev * 10) + digit; num = num / 10; num = parseInt(num); } if( n == rev) alert(" Integer is palindrome "); else alert(" Integer is not palindrome "); document.frm.text1.value=""; } } </script> </head> <body> <form name="frm"> <h1 align="center">To check whether a number is palindrome or not</h1> <hr color="red"> <center> Enter a number: <input type="text" name="text1"> <br><br> <input type="button" value="Check Palindrome" onclick="isPalindrome()"> GOVT.POLYTECHNIC BIJAPUR 15
  • 16.
    Part-B Web DesignLab JavaScript </center> </form> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 16
  • 17.
    Part-B Web DesignLab JavaScript PROGRAM 8 JAVA SCRIPT TO ILLUSTRATE DIFFERENT IN-BUILT STRING FUNCTIONS. <html> <body> <script type="text/javascript"> var str="Hello World"; document.write("<center>"); document.write("<h1> Example for String Functions </h1> "); document.write("<hr color=red>"); document.write(str.big()+"<br>"); document.write(str.small()+"<br>"); document.write(str.bold()+"<br>"); document.write(str.italics()+"<br>"); document.write(str.fixed()+"<br>"); document.write(str.strike()+"<br>"); document.write(str.sup()+"<br>"); document.write(str.sub()+"<br>"); document.write(str.blink()+"<br>"); document.write(str.link("p1.html")+"<br>"); document.write(str.fontcolor("green")+"<br>"); document.write(str.fontsize(6)+"<br>"); document.write("</center>"); </script> </body> </html> OUTPUT GOVT.POLYTECHNIC BIJAPUR 17