Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
7 views

javascript print1

The document contains a series of practical exercises for a Web Design II course, focusing on JavaScript integration with HTML. It includes examples of embedding JavaScript, using conditional statements, looping statements, string functions, and event handling. Additionally, it demonstrates the use of dialog boxes and form handling in JavaScript.

Uploaded by

laita nikam
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
7 views

javascript print1

The document contains a series of practical exercises for a Web Design II course, focusing on JavaScript integration with HTML. It includes examples of embedding JavaScript, using conditional statements, looping statements, string functions, and event handling. Additionally, it demonstrates the use of dialog boxes and form handling in JavaScript.

Uploaded by

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

S.S.and S.

S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 1. Write a program to embed JavaScript into HTML.

**********************************************************************************
<html>
<head>
<title> page title</title>
<script>
document.write("Welcome to Javatpoint");
</script> </head>
<body>
<p>Inthis example we saw how to add JavaScript in the head section </p>
</body>
</html>
Example
<html>
<head>
<title> page title</title>
</head>
<body>
<p> <a href="#" onClick="alert('Welcome !');">Click Me</a> </p>
<p> in this example we saw how to use inline JavaScript or directly in an HTML tag. </p>
</body>
</html>
Example
<html>
<head>
<meta charset="utf-8">
<title>Including a External JavaScript File</title> </head>
<body>
<form>
<input type="button" value="Result" onclick="display()"/>
</form>
<script src="hello.js">
</script>
</body>
</html>
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 2. : Write a JavaScript code to demonstrate Conditional Statements

**********************************************************************************
*************
Practical 2a
<html>
<head>
<title>IF Statments!!!</title>
<script type="text/javascript">
var age = prompt("Please enter your age");
if(age>=18)
document.write("You are an adult <br />");
if(age<18)
document.write("You are NOT an adult <br />");
</script>
</head>
<body>
</body>
</html>

OUTPUT
Practical 2b
<html>

<head>

<title>If...Else Statments!!!</title>

<script type="text/javascript">

// Get the current hours

var hours = new Date().getHours();

if(hours<12)

document.write("Good Morning!!!<br />");

else

document.write("Good Afternoon!!!<br />");

</script>

</head>

<body>

</body>

</html>

OUTPUT
Practical 2c
<html>
<head>
<script type="text/javascript">
var one = prompt("Enter the first number");
var two = prompt("Enter the second number");
one = parseInt(one);
two = parseInt(two);
if (one == two)
document.write(one + " is equal to " + two + ".");
else if (one<two)
document.write(one + " is less than " + two + ".");
else
document.write(one + " is greater than " + two + ".");
</script>
</head>
<body>
</body>
</html>

OUTPUT
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 3. : Write a JavaScript code to demonstrate Looping Statements

*********************************************************************************
Practical 3 a
<html>
<head>
<script type="text/javascript">
var students = new Array("John", "Ann", "Aaron", "Edwin", "Elizabeth");
document.write("<b>Using for loops </b><br />");
for (i=0;i<students.length;i++)
{
document.write(students[i] + "<br />");
}
</script>
</head>
<body>
</body>
</html>
Practical 3 B While Loop
html>
<head>
<script type="text/javascript">
document.write("<b>Using while loops </b><br />");
var i = 0, j = 1, k;
document.write("Fibonacci series less than 40<br />");
while(i<40)
{
document.write(i + "<br />");
k = i+j;
i = j;
j = k;
}
</script>
</head>
<body>
</body>
</html>

Output
Practical 3 C Do While
<html>
<head>
<script type="text/javascript">
document.write("<b>Using do...while loops </b><br />");
var i = 2;
document.write("Even numbers less than 20<br />");
do
{
document.write(i + "<br />");
i = i + 2;
}while(i<20)
</script>
</head>
<body>
</body>
</html>

Output
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 4 :-Write JavaScript code to demonstrate different string functions.

*********************************************************************************
Practical 4:- charAt()
<html>
<script>
var str="javascript";
document.write(str.charAt(2));
</script>
</html>
Output
Pract4 a :-
<html>
<script>
var s1="javascript ";
var s2="concat example";
var s3=s1.concat(s2);
document.write(s3);
</script>
</html>

Practical:- 4 b
<html>
<script>
var s1="javascript from javatpoint indexof";
var n=s1.indexOf("from");
document.write(n);
</script>
</html>
OUTPUT
Practical 4 c
<html>
<script>
var s1="javascript from javatpoint indexof";
var n=s1.lastIndexOf("java");
document.write(n);
</script>
</html>
OUPUT

Practical 4 d
<html>
<script>
var s1="JAVASCRIPT EXAMPLR FOR LOWER CASE";
var s2=s1.toLowerCase();
document.write(s2);
</script>
</html>

OUTOUT
Practical 4 e
<html>
<script>
var s1="JavaScript toUpperCase Example";
var s2=s1.toUpperCase();
document.write(s2);
</script>
</html>

Output
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 5. : Write JavaScript code to demonstrate onblur, onfocus, onload, onsubmit

*********************************************************************************
Practical 5 a Onblur
<html>
<head></head>
<body style="margin-left: 40%;">
<p>Write something in the input box and then click elsewhere
in the document body.</p>
<input onblur="alert(this.value)">
</body>
</html>
OUTPUT
Practical 5 b
<!doctype html>
<html>
<head>
<script>
function focused() {
var e=document.getElementById('inp');
if(confirm('Got it?')) {
e.blur();
}
}
</script>
</head>
<body>
<p style="margin-left: 45%;">
Take the focus into the input box below:
</p>
<input id="inp"
onfocus="focused()""
style=" margin-left: 45%;">
</body>

</html>
OUTPUT
Practical 5 D
<html>
<head>
<script type = "text/javascript">
<!--
function validation() {
all validation goes here
.........
return either true or false
}
//-->
</script>
</head>
<body>
<form method = "POST" action = "t.cgi" onsubmit = "return validate()">
.......
<input type = "submit" value = "Submit" />
</form>
</body>
</html>
OUTPUT
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 6. : Write JavaScript code to demonstrate onkeypress, onmouseover, onmouseout.

onmouseover, onmouseout
<html>
<script type="text/javascript">
function over()
{
document.getElementById('key').innerHTML= "Onmouseover event has occurred";
}
function out()
{
document.getElementById('key').innerHTML=
"Onmouseout event has occurred";
}
</script>
<body>
<h2 id="key" onmouseover="over()" onmouseout="out()">
Original Text
</h2></body>
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 7 : Write a program to perform addition of two numbers using web form.

*************************************************************************

<!doctype html>
<html>
<head>
<script>
function add()
{
var numOne, numTwo, sum;
numOne = parseInt(document.getElementById("first").value);
numTwo = parseInt(document.getElementById("second").value);
sum = numOne + numTwo;
document.getElementById("answer").value = sum;
}
</script>
</head>
<body>
<p>Enter the First Number: <input id="first"></p>
<p>Enter the Second Number: <input id="second"></p>
<button onclick="add()">Add</button>
<p>Sum = <input id="answer"></p>
</body>
</html>
OUTPUT
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 8 :. Create a HTML page to demonstrate Date object using JavaScript.

*************************************************************************
Practical 8
<html>
<body>
Current Date and Time: <span id="txt"></span>
<script>
var today=new Date();
document.getElementById('txt').innerHTML=today;
</script>
</body>
</html>

Output
S.S.and S.S’s
Vidhydhan Commerce college Wadel Road Dhule
Department of Computer Science
Class :- FYBCA SEM -II Subject BCA 207 Web Designe II
Student Name :-

Practical 9 :. Write JavaScript code to demonstrate use of Dialog Boxes.

*************************************************************************
Practical9 a Alert Dialog box
<html>
<head>
<script type="text/javascript">
function show() {
alert("It is an Alert dialog box");
}
</script>
</head>
<body>
<center>
<h1>Hello World :) :)</h1>
<h2>Welcome to javaTpoint</h2>
<p>Click the following button </p>
<input type="button" value="Click Me" onclick="show();" />
</center>
</body>
</html>

Ouput
Practical 9 b Confirmation Dialog box
<html>
<head>
<script type="text/javascript">
function show() {
var con = confirm ("It is a Confirm dialog box");
if(con == true) {
document.write ("User Want to continue");
}
else {
document.write ("User does not want to continue");
}
}
</script>
</head>
<body>
<center>
<h1>Hello World :) :)</h1>
<h2>Welcome to javaTpoint</h2>
<p>Click the following button </p>
<input type="button" value="Click Me" onclick="show();" />
</center>
</body>
</html>
Output
Practical 9 c Prompt Dialog box
<html>
<head>
<script type="text/javascript">
function show() {
var value = prompt("Enter your Name : ", "Enter your name");
document.write("Your Name is : " + value);
}
</script> </head>
<body>
<center>
<h1>Hello World :) :)</h1>
<h2>Welcome to javaTpoint</h2>
<p>Click the following button </p>
<input type="button" value="Click Me" onclick="show();" />
</center>
</body>
</html>

You might also like