Scribd
Upload
15 views

Css-Internal and External Programs_2024

Uploaded by

korekashinath69
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
15 views

Css-Internal and External Programs_2024

Uploaded by

korekashinath69
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 22

CSS Programs for Internal and External exam

1. Write a JavaScript program which accepts N as input and print first N odd numbers.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function fun(str)
{
var num=Number(str);
var i,j,k,count;
document.write("<h3>"+" The odd numbers are..."+"</h3>");
for(i=0;i<=num;i++)
{
if(i%2!=0)
document.write(" "+i);
}
}
</script>
</head>
<body>
<script type="text/javascript">
var input_str=prompt("Enter some number","");
fun(input_str);
</script>
</body>
</html>
2. Write a JavaScript for sorting the array elements.

<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<script>
var a = ["Sanjay","Aman","Rehman","Karan"];

document.write(a + "<br><br>");
a.sort();
document.write(a);
</script>
</head>
<body>
</body>
</html>
3. Develop JavaScript to implement Strings (any 4 methods).

<!DOCTYPE html>
<html>
<head>
<title>JavaScript</title>
<script>
var str = "JavaScript is a Great is Language";
var str2 = "Hello";
var str3 = 50;
document.write("Original string::"+str+"<br>");
var a = str.charAt(3); /* CharAt Method */
document.write("char at method 3::"+ a + "<br>");

var b = str.charCodeAt(4); /* CharCodeAt Method ,returns unicode*/


document.write("char code at 4::"+ b + "<br>");

var d = str.concat(str2); /* Concat Method */


document.write("string concatenation::"+ d + "<br>");

var e = str.split(" "); /* Split Method */


document.write("String split::"+ e + "<br>");

var f = str.repeat(2); /* Repeat Method */


document.write("String repeat::" + f + "<br>");

var g = str.slice(3,10); /* Slice Method */


document.write("Slice method::"+ g + "<br>");

var h = str.substr(2,5); /* Substr Method */


document.write("Substr method ::"+ h + "<br>");

var i = str.substring(2,5); /* Substring Method */


document.write("Substring Method::"+ i + "<br>");

var j = str3.toString(); /* Tostring Method */


document.write("Tostring Method::"+j + 20 + "<br>");

var k = str.valueOf(); /* Valueof Method */


document.write("Valueof Method::"+ k + "<br>");
</script>
</head>
<body>
</body>
</html>
4. Develop JavaScript to demonstrate function call from html

<!DOCTYPE html>

<html>

<head>

<script type="text/javascript">

function A()

alert("Inside the function A");

</script>

</head>

<body onload="A()">

</script>

</body>

</html>

Note- or Any other code


5. Design student registration form that contains name, address, contact number, class,
gender and subject you like. Use proper form controls and submit it

<!DOCTYPE html>

<html >

<head>

<title>My Page</title>

<h3 align="center">Registration form</h3>

</head>

<body>

<form>

<b>Student Name:</b><input type="text" size="20" value=""><br/><br/>

<b>Address:</b><input type="text" size="35" value=""><br/><br/>

<b>Contact No:</b><input type="text" size="20" value=""><br/><br/>

<b>Select Gender:</b><br/><br/>

<input type="radio" name="gender" value="male">MALE<br/><br/>

<input type="radio" name="gender" value="female">Female<br/><br/>

<b>Select Class:</b><br/><br/>

<input type="radio" name="class" value="fyco">FYCO<br/><br/>

<input type="radio" name="class" value="syco">SYCO<br/><br/>

<input type="radio" name="class" value="tyco">TYCO<br/><br/>


<div align="left"><br>

Select the subject(s) of your choice<br/>

<input type="checkbox" name="option1" value="css" checked="checked">CSS<br/>

<input type="checkbox" name="option2" value="osy">OSY<br/>

<input type="checkbox" name="option3" value="ajp">AJP<br/>

</div>

<br/><br/><br/>

<input type="submit" value="Submit"/>

<input type="reset" value="Clear"/>

</form>

</body>

</html>
6. Write JavaScript that demonstrate mouse events.

<html>

<title>mouse click demo</title>

<body>

<form>

<input type="submit" value="submit" onclick="my_fun()">

</form>

<script>

function my_fun()

alert("You clicked mouse")

</script>

</body>

</html>

Or

<!DOCTYPE html>

<html>

<body>

<h1 onmouseover="style.color='red'" onmouseout="style.color='black'">Mouse over


this text</h1>

</body>

</html>
Or

<html>

<head>

<script> function myFunction(elmnt, clr)

{ elmnt.style.color = clr;

</script>

</head>

<body>

<h2 onmousedown="myFunction(this,'red')" onmouseup="myFunction(this,'green')">


hi how r u?

</h2>

</body>

</html>
7. Write a JavaScript to create three categories - Fruit, Flower and Color. Based on the
selection of category, the item, in the option list must get changed.

<html>

<head>

<script type="text/javascript">

function MySelection(val)

with(document.forms.myform)

if(val==1)

choices[0].text="Mango"

choices[0].value=1

choices[1].text="Orange"

choices[1].value=2

choices[2].text="Banana"

choices[2].value=3

if(val==2)

choices[0].text="Rose"

choices[0].value=1

choices[1].text="Jasmine"

choices[1].value=2
choices[2].text="Lotus"

choices[2].value=3

if(val==3)

choices[0].text="Red"

choices[0].value=1

choices[1].text="Green"

choices[1].value=2

choices[2].text="Blue"

choices[2].value=3

</script>

</head>

<body>

<h4>Select the Desired Category</h4>

<form name="myform">

<input type="radio" name="items" checked="true" value=1


onclick=MySelection(this.value)>Fruit

<input type="radio" name="items" value=2 onclick=MySelection(this.value)>Flower

<input type="radio" name="items" value=3 onclick=MySelection(this.value)>Colour

<br/><br/>
<select name="choices">

<option Value=1>Mango

<option Value=2>Orange

<option Value=3>Banana

</select>

</form>

</body>

</html>

8 Write a JavaScript to create a pull – down menu with three options [Google,MSBTE,
Yahoo] once the user will select one of the options then user will be Redirected to
that site.
<!DOCTYPE>
<html>
<head>
<title>Pull Down Menu</title>
<script language="Javascript">
function Display(Ch)
{
MyPage = Ch.options[Ch.selectedIndex].value
if (MyPage != "")
{
window.location = MyPage
}
}

</script>
</head>
<body onload="document.Form1.MyMenu.selectedIndex=0">
<form action="" name="Form1">
<select name="MyMenu" onchange="Display(this)">
<option>Select option</option>
<option value="https://www.google.com/">Google</option>
<option value="https://msbte.org.in/"> MSBTE</option>
<option value="https://in.search.yahoo.com/?fr2=inr"> Yahoo</option>
</select>
</form>
</body>
</html>

9. Develop JavaScript that demonstrates key events.


<html>
<head>
<script>
function myFunction() {
alert("You pressed a key inside the input field");
}
</script>
</head>
<body>
<input type="text" onkeydown="myFunction()">
</body>
</html>
Note-Or any other key event program
10. Write a program that will demonstrate disable elements
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function EnableFunction()
{
document.forms.myform.name.disabled=false
}
function DisableFunction()
{
document.forms.myform.name.disabled=true
}
</script>
</head>
<body>
<form name="myform">
User Name:<input type="text" name="name"/>
<br/><br/>
<input type="button" value="Disable Name Field" onclick="DisableFunction()"/>
<br/><br/>
<input type="button" value="Enable Name Field" onclick="EnableFunction()"/>
</form>
</body>
</html>
11. Write JavaScript to create, read and delete cookie.
<!DOCTYPE html>
<script>
document.cookie="sgm=mahagaon"//set cookies

var getCookie=document.cookie;

document.write(getCookie)//read cookies
document.cookie= "sgm=polytechnic;expires=Mon, 31 Oct 2022 11:00:00
UTC;"//delete cookies
document.write(getCookie)//read
console.log(getCookie);
</script>
</html>

12. Write JavaScript to create web page in new window


<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function CreateFunction()
{
var mywin=window.open("","MyWindow","width=300,height=300")
mywin.document.write("<html>");
mywin.document.write("<head>");
mywin.document.write("<title>WEB SITE DEMO</title>");
mywin.document.write("</head>");
mywin.document.write("<body>");
mywin.document.write("<h2>This is a new Web Page</h2>");
mywin.document.write("<h3 style='color:red;font-size:30'>Welcome User!!!</h3>");
mywin.document.write("<a href='www.google.com'>CLick here");
mywin.document.write("</body>");
mywin.document.write("</html>");
}
</script>
</head>
<body>
<form name="form1">
<input type="button" value="Create Web Page" onclick="CreateFunction()"/>
</form>
</body>
</html>
13. Write a JavaScript to demonstrate setInterval and setTimeout methods of timers.
1.setTimeout
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function MyFunction()
{
alert("Welcome User!!!");
}
</script>
</head>
<body>
<form name="form1">
<input type="button" value="Click Me" onclick="setTimeout(MyFunction,4000);"/>
</form>
</body>
</html>

2.SetInterval()
<!DOCTYPE html>
<html>
<body>
<p id="ID"></p>
<script type="text/javascript">
var t=setInterval(MyFunction,2000);
function MyFunction()
{
document.getElementById("ID").innerHTML+="<p>Welcome User!!!</p>";
}
</script>
</body>
</html>
14. Write a program for mobile number validation using regular expression
<html>
<head>
<script type="text/javascript">
var re = /^[7-9][0-9]{9}$/;
function testMatch()
{
var str=textfield.value;
if(re.test(str))
{
alert("Your mobile number is " + str);
}
else
{
alert("Please enter correct mobile numebr");
}
}

</script>
</head>
<body>
<h2>Checking valid mobile number</h2>

Enter a moile number <input type="text" id="textfield"/>


<input type="button" value="Check" onclick="testMatch()">

</body>
</html>
15. Write a JavaScript in which when user rolls over the name of fruit, the
corresponding image should be displayed. For instance - if user rolls over the text
"Mango"; the image of Mango should be displayed
<!DOCTYPE html>
<html>
<head>
<title>Rollover Text</title>
</head>
<body>
<table>
<tr>
<td>
<a>
<IMG src="Mango.jpg" name="fruit">
</a>
<a onmouseover="document.fruit.src=' Mango.jpg'">
<b><u>Mango</u></b>
</a>
<br/><br/><br/><br/>
<a onmouseover="document.fruit.src='Orange.jpg'">
<b><u>Orange</u></b>
</a>
<br/><br/><br/><br/>
<a onmouseover="document.fruit.src='banana.jpg'">
<b><u>Banana</u></b>
</a>
</td>
</tr>
</table>
</body>
</html>
16. Create a slideshow with the group of four images, also simulate the next and
previous transition between slides in your JavaScript

<!DOCTYPE html>
<head>
<script language="Javascript">
MySlides=new Array('slide1.jpg','slide2.jpg','slide3.jpg','slide4.jpg')
i=0
function DisplaySlides(SlideNumber)
{
i=i+SlideNumber;
if (i>MySlides.length-1)
{
i=0;
}
if (i<0)
{
i=MySlides.length-1;
}
document.SlideID.src=MySlides[i];
}
</script>
</head>
<body>
<img src="slide1.jpg" name="SlideID" width="400" height="400" />
<br/><br/>
<input type="button" value="Back" onclick="DisplaySlides(-1)">
<input type="button" value="Forward" onclick="DisplaySlides(1)">
</body>
</html>
17. Write a suitable JavaScript to create a pull down menu.

<!DOCTYPE>
<html>
<head>
<title>Pull Down Menu</title>
<script language="Javascript">
function Display(Ch)
{
MyPage = Ch.options[Ch.selectedIndex].value
if (MyPage != "")
{
window.location = MyPage
}
}

</script>
</head>
<body onload="document.Form1.MyMenu.selectedIndex=0">
<form action="" name="Form1">
<select name="MyMenu" onchange="Display(this)">
<option>Books</option>
<option value="Fiction.html">Fiction</option>
<option value="NonFiction.html"> Non Fiction</option>
</select>
</form>
</body>
</html>
18. Create a slideshow with the group of four images, also simulate the next and
previous transition between slides in your JavaScript.
<!DOCTYPE html>
<head>
<script language="Javascript">
MySlides=new Array('slide1.jpg','slide2.jpg','slide3.jpg','slide4.jpg')
i=0
function DisplaySlides(SlideNumber)
{
i=i+SlideNumber;
if (i>MySlides.length-1)
{
i=0;
}
if (i<0)
{
i=MySlides.length-1;
}
document.SlideID.src=MySlides[i];
}
</script>
</head>
<body>
<img src="slide1.jpg" name="SlideID" width="400" height="400" />
<br/><br/>
<input type="button" value="Back" onclick="DisplaySlides(-1)">
<input type="button" value="Forward" onclick="DisplaySlides(1)">
</body>
</html>
19.Write a JavaScript that disables the right click button and displays the message
'Right click button is ‘disable'.
<!DOCTYPE html>
<html>
<head>
<title>Locking the Right Mouse Button</title>
<script language=JavaScript>
function RightClickDisable()
{
alert('Not allowed to right click');
return false;
}
function InternetExploreBrowser()
{
if (event.button==2)
{
RightClickDisable();
return false
}
}
document.oncontextmenu=new Function("RightClickDisable();return false")
</script>
</head>
<body>
<h1> This is a sample web page</h1>
<h4> Test disability of right click button by clicking right button</h4>
</body>
</html>

You might also like