Scribd
Upload
3 views3 pages

JavaScript Day1

The document contains two examples of HTML with embedded JavaScript. The first example demonstrates a simple JavaScript program that displays alerts welcoming students. The second example showcases button click events that change text and background color, as well as display a submitted name from an input field.

Uploaded by

smehaboobbasha2005
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
3 views3 pages

JavaScript Day1

The document contains two examples of HTML with embedded JavaScript. The first example demonstrates a simple JavaScript program that displays alerts welcoming students. The second example showcases button click events that change text and background color, as well as display a submitted name from an input field.

Uploaded by

smehaboobbasha2005
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Example1: First Java Script Program:

<!--HTML Structure-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First JavaScript</title>
<style>
body{
text-align: center;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-
serif;
margin-top: 100px;
}
h1{
color:blue;
}
</style>
</head>
<body>
<h1>Welcome Students</h1>
<script>
alert("Welcome to JavaScript");
alert("This is your first java script program");
</script>
</body>
</html>
Example2: Button Click Event:
<!--Button Click Event-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Button click Event</title>
<style>
body{
background-color: green;
}
</style>

</head>
<body>
<h2 id="msg">Click the Button</h2>
<button onclick="showMessage()">Click Me</button>
<br>
<br>
<button onclick="changeColor()">
Change Background
</button>
<br>
<Br>
<br>
<input type="text" id="name">
<button onclick="displayName()">
Submit
</button>
<h2 id="result"></h2>
<script>

function showMessage(){
[Link]("msg").innerHTML="JavaScript is Working";

}
function changeColor(){
[Link]="yellow";

}
alert("Try the submit button");
function displayName(){
let studentName=[Link]("name").value ;
[Link]("result").innerHTML="Welcome " +
studentName;

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

You might also like