Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
160 views

Css Practical Ans

Answer of JavaScript manual

Uploaded by

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

Css Practical Ans

Answer of JavaScript manual

Uploaded by

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

Pract:-1

1] The user enters two numbers in respective text boxes. Write a JavaScript such that when user clicks
“add”, a message box displays sum of two entered numbers, if the user clicks on “sub”, message box
displays subtraction of two numbers and on clicking “mul” the message box displays multiplication of
two numbers.

Ans:

<html>

<head>

<title> Arithmatic operations</title>

</head>

Enter First Number: <input type="text" id="no1">

<br><br>

Enter Second Number: <input type="text" id="no2">

<br><br>

<button onclick="add()">ADD</button>

<button onclick="sub()">SUB</button>

<button onclick="mul()">MUL</button>

<script>

function add()

var no1,no2,r;

no1=parseInt(document.getElementById("no1").value);

no2=parseInt(document.getElementById("no2").value);

r=no1+no2;

window.alert("Addtion is: "+r);

function sub()

var no1,no2,r;

no1=parseInt(document.getElementById("no1").value);
no2=parseInt(document.getElementById("no2").value);

r=no1-no2;

window.alert("Substraction is: "+r);

function mul()

var no1,no2,r;

no1=parseInt(document.getElementById("no1").value);

no2=parseInt(document.getElementById("no2").value);

r=no1*no2;

window.alert("Multiplication is: "+r);

</script>

</body>

</html>

Output:
Pract:-2

1) Write a JavaScript for loop that will iterate from 1 to 15. For each iteration, it Will check if the
current number is odd or even and display a message to the Screen.
Sample Output : “1 is odd” “2 is even”
Ans:
<html>
<head>
<title> For Loop</title>
</head>
<body>
<script>
for(i=1;i<=15;i++)
{
if(i%2==0)
{
document.write(i+" is even <br>");
}
else
{
document.write(i+" is odd <br>");
}
}
</script>
</body>
</html>

Output:
2) Write a Java script code to display 5 elements of array in sorted order
Ans:
<html>
<head>
<title>Sorted Array</title>
</head>
<body>
<script>
let numbers=[50,25,48,92,7];
numbers.sort(numeric_sort);
function numeric_sort(a,b)
{
return a-b;
}
alert("sorted Array :"+numbers);
</script>
</body>
</html>

Output:
Pract:-3

1) Write a Java script program which computes, the average marks of following students
then, this average is used to determine the corresponding Grade.
Ans:
<html>
<head>
<title>Compute the Average Marks and Grade</title>
</head>
<body>
<script>
var students = [['Summit', 80], ['Kalpesh', 77], ['Amit', 88], ['Tejas', 93], ['Abhishek', 65]];
var Avgmarks = 0;

for (var i = 0; i < students.length; i++) {

Avgmarks += students[i][1];

}
var avg = Avgmarks / students.length;

document.write("Average grade: " + avg);

document.write("<br>");

if (avg < 60) {

document.write("Grade : E");
} else if (avg < 70) {
document.write("Grade : D");
} else if (avg < 80) {
document.write("Grade : C");
} else if (avg < 90) {
document.write("Grade : B");
} else if (avg <= 100) {
document.write("Grade : A");
}
</script>
</body>
</html>
Output:
2) Write a Java script code to display 5 elements of array in sorted order.
Ans:

<html>

<head>
<title>Sorted Array</title>
</head>
<body>
<script>
let numbers=[50,25,48,92,7];

numbers.sort(numeric_sort);

function numeric_sort(a,b)

return a-b;
}
alert("sorted Array :"+numbers);
</script>
</body>
</html>

Output:
Pract:-4
1)Write a Java script program to implement function.
Ans:
<html>
<head>
<title>Function Example</title>
</head>
<body>
<script>
function calculateSum(a, b) {
return a + b;
}
var num1 = 10;
var num2 = 20;
var sum = calculateSum(num1, num2);
document.write("The sum of " + num1 + " and " + num2 + " is: " + sum);
</script>
</body>
</html>

Output:
Pract:-5

1) Write a Java script that will replace following specified value with another value in a string.
String = “ I will fail” Replace “fail” by “pass”
Ans:
<html>
<head>
<title>String Replace Example</title>
</head>
<body>
<script>
var myStr = 'I will fail';
var newStr = myStr.replace('fail', 'pass');
document.write(newStr);
</script>
</body>
</html>

Output:
2) Write JavaScript code to perform following operations on string. (Use split() Method) Input
String : “Sudha Narayana Murthy” Display output as First Name : Sudha Middle Name :
Narayana Last Name : Murthy
Ans:
<html>
<head>
<title>Split String Example</title>
</head>
<body>
<script>
var fullName = "Sudha Narayana Murthy";
var nameParts = fullName.split(" ");
document.write("First Name : " + nameParts[0] + "<br>");
document.write("Middle Name : " + nameParts[1] + "<br>");
document.write("Last Name : " + nameParts[2]);
</script>
</body>
</html>

Output:
Pract:-6

1)Design webpage using form elements .

Ans:

<html>

<head>

<title>Form elements</title>

</head>

<body>

<form action="#">

Enter your Username: <input type="text" id="nm"><br><br>

Enter your Password: <input type="password" id="pwd"><br><br>

<button onclick="fun()">Submit</button>

<script>

function fun() {

name=document.getElementById("nm").value;

pass=document.getElementById("pwd").value;

alert(" username is "+name+" password is "+pass);

</script>

</body>

</html>

Output:
Pract:-7

1)write java script program to implement all mouse events.

<html>

<head> <title>Mouse Events Example</title> </head>

<body>

<h1>Check the document for mouse events</h1>

<div id="box"

style= "width: 400px; height:400px; border: 2px solid blue; text-align:center; background-
color:green"

onclick="handleClick(event)"

ondblclick="handleDblClick(event)"

onmousedown="handleMouseDown(event)"

onmouseup="handleMouseUp(event)"

onmousemove="handleMouseMove(event)"

onmouseover="handleMouseOver(event)"

onmouseout="handleMouseOut(event)"

oncontextmenu="handleContextMenu(event)">

Hover or Click Me

</div>

<script>

function handleClick(event) {

console.log('Box clicked! Coordinates: (' + event.clientX + ', ' + event.clientY + ')');

function handleDblClick(event) {

console.log('Box double-clicked!');

function handleMouseDown(event) {

console.log('Mouse button pressed: ' + event.button);

}
function handleMouseUp(event) {

console.log('Mouse button released');

function handleMouseMove(event) {

document.getElementById('box').innerText = 'Mouse Position: (' + event.clientX + ', ' +


event.clientY + ')';

function handleMouseOver(event) {

document.getElementById('box').style.backgroundColor = 'lightcoral';

function handleMouseOut(event) {

document.getElementById('box').style.backgroundColor = 'lightblue';

function handleContextMenu(event) {

console.log('Right-click (context menu) event!');

</script>

</body>

</html>

Output:
Pract:-8

1)write java script program to implement all Form events.

Ans:

<html>

<head>

<title>Form Events</title>

</head>

<body>

<form id="myForm">

<input type="text" id="name" placeholder="Name" onfocus="focusEvent()"


onblur="blurEvent()"><br><br>

<select id="mySelect" onchange="changeEvent()">

<option value="1">Option 1</option>

<option value="2">Option 2</option>

</select><br><br>

<button type="submit">Submit</button>

<button type="reset">Reset</button>

</form>

<p id="output"></p>

<script>

document.getElementById('myForm').onsubmit = function(event) {

event.preventDefault(); // Prevent default form submission

document.getElementById('output').textContent = "Form submitted!";

};

document.getElementById('myForm').onreset = function() {

document.getElementById('output').textContent = "Form reset!";

};

function focusEvent() {
document.getElementById('output').textContent = "Input field focused!";}

function blurEvent() {

document.getElementById('output').textContent = "Input field blurred!";

function changeEvent() {

document.getElementById('output').textContent = "Option changed!";

document.getElementById('name').oncontextmenu = function(event) {

event.preventDefault(); // Prevent context menu

document.getElementById('output').textContent = "Right-click disabled!";

};

</script>

</body>

</html>

Output:
Pract:-9

1)Write a javascript program to demonstrate java intrinsic function.

Ans:

<html>

<head> <title> intrinsic function</title> </head>

<body> <script>

let res=eval("2+2");

document.write(res+"<br>");

let num=parseInt("10",10);

document.write(num+"<br>");

let floatnum=parseFloat("10.5");

document.write(floatnum+"<br>");

let isnan=isNaN("hello");

document.write(isnan+"<br>");

let str=String(10)

document.write(str+"<br>");

let bool=Boolean(1);

document.write(bool+"<br>");

let number=Number("10");

document.write(number+"<br>");

</script> </body> </html>

Output:
Pract:-10

1)Write a javascript program to create read, update and delete cookies.

Ans:

<html>

<head>

<title>Storing Passsword in Cookie</title>

</head>

<body>

Enter UserName

<input type="text" id="uN">

<br>

Enter Password

<input type="password" id="pw"><br><input type="button" value="Login" onclick="storeCookie()">

<script>

function storeCookie(){

pwd=document.getElementById("pw").value;

document.cookie="password"+"="+pwd+";";

</script>

</body>

</html>

Output
2)Design a webpage that displays a form that contains an input for username and password.
User is prompted to enter the username and password and password become the value of
cookie. Wrire a javascript function and program for it.

<html>
<head>
<title>Storing Passsword in Cookie</title>
</head>
<body>
Enter UserName
<input type="text" id="uN">
<br>
Enter Password
<input type="password" id="pw">
<br>
<input type="button" value="Login" onclick="storeCookie()">

<script>
function storeCookie()
{
pwd=document.getElementById("pw").value;
document.cookie="password"+"="+pwd+";";
}
</script>

</body>
</html>
Pract:-11

1)Write a javascript to open a new window and the new window is having two Frames.

One frame containing buthon as “click here !”, and after clicking this

Button an image should open in the second frame of that child window.

Ans:

<!DOCTYPE html>

<html>

<head> <title>Open Frames Window</title>

<script>

function openFramesWindow() {

let childWindow = window.open("", "childWindow", "width=600,height=400");

childWindow.document.write(`

<html>

<head>

<title>Frames Window</title>

</head>

<frameset cols="50%,50%">

<frame name="frame1">

<frame name="frame2">

</frameset>

</html> `);

childWindow.frames["frame1"].document.write(`

<html>

<head><title>Frame 1</title></head>

<body>

<button onclick="parent.displayImage()">Click Here!</button>

</body>

</html>
childWindow.displayImage = function() {

childWindow.frames["frame2"].document.write(`

<html>

<head><title>Frame 2</title></head>

<body>

<img src="C:\Users\Hp\Pictures\Screenshots\Screenshot (26).png">

</body>

</html>

`);

}; }

</script>

</head>

<body>

<button onclick="openFramesWindow()">Open Window with Frames</button>

</body>

</html>

output
Pract:-12

1) Write a javascript program to validate email ID of the user using regular Expression

Ans:

<html>

<head> <title>Email Validation</title> <script>

function validateEmail() {

let email = document.getElementById("email").value;

let regex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;

if (regex.test(email)) {

document.getElementById("output").textContent = "Valid Email!";

document.getElementById("output").style.color = "green";

} else {

document.getElementById("output").textContent = "Invalid Email!";

document.getElementById("output").style.color = "red";

}}

</script> </head>

<body> <h2>Email Validation</h2>

<input type="text" id="email" placeholder="Enter your email">

<button onclick="validateEmail()">Validate</button>

<p id="output"></p>

</body>

</html>

Output
2) Write a JavaScript that accepts a string and searches for the pattern “MSBTE”

In the given string using regular expressions. If the pattern is found,

JavaScript will display that “Pattern is found” else display “Pattern is not

Found”.

Ans:

<html>

<head>

<title>JavaScript RegExp exec Method</title>

</head>

<body>

<script type = "text/javascript">

var str= prompt("Enter a string");

var re = new RegExp( "MSBTE", "g" );

var result = re.exec(str);

if(result=="MSBTE"){

alert("pattern is found");

else {

alert("pattern is not found");

}</script>

</body>

</html>

Output
Pract 13:

1) Write a JavaScript that accepts a string and searches for the pattern “MSBTE”

In the given string using regular expressions. If the pattern is found,

JavaScript will display that “Pattern is found” else display “Pattern is not

Found”.

Ans:

<html>

<head>

<title>JavaScript RegExp exec Method</title>

</head>

<body>

<script type = "text/javascript">

var str= prompt("Enter a string");

var re = new RegExp( "MSBTE", "g" );

var result = re.exec(str);

if(result=="MSBTE"){

alert("pattern is found");

else {

alert("pattern is not found");

}</script>

</body>

</html>

Output
Pract:-14

1) 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 sit

Ans:

<html>

<body>

<form>

<select id="webOptions" onchange="redirectToSite()">

<option value="">Select a site</option>

<option value="https://www.google.com">Google</option>

<option value="https://msbte.org.in/">MSBTE</option>

<option value="https://www.yahoo.com">Yahoo</option>

</select>

</form>

<script>

function redirectToSite() {

const selectedSite = document.getElementById('webOptions').value;

if (selectedSite) {

window.location.href = selectedSite;

}}

</script>

</body>

</html>

Output
Pract:-15

Write a Java script to modify the status bar using on MouseOver and on MouseOut with links. When
the user moves his mouse over the link, it will Display “MSBTE” in the status bar. When the user
moves his mouse away From the link the status bar will display nothing.

Ans:

<html>

<head>

<title>JavaScript Status Bar</title></head>

<body>

<a href=" https://msbte.org.in/"

onMouseOver="window.status='MSBTE';return true"

onMouseOut="window.status='';

return true">MSBTE </a>

</body>

</html>

output
Pract:-16

Write a Java script to modify the status bar using on MouseOver and on MouseOut with links. When
the user moves his mouse over the link, it will Display “MSBTE” in the status bar. When the user
moves his mouse away From the link the status bar will display nothing.

Ans:

<html>

<head>

<title>JavaScript Status Bar</title></head>

<body>

<a href=" https://msbte.org.in/"

onMouseOver="window.status='MSBTE';return true"

onMouseOut="window.status='';

return true">MSBTE </a>

</body>

</html>

output

You might also like