Scribd
Upload
12 views4 pages

Lab 3

Uploaded by

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

Lab 3

Uploaded by

riserik513
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

3 , understanding js syntax

JavaScript syntax comprises a set of rules that define how to construct a


JavaScript code. JavaScript statements that are placed within
the <script>... </script> HTML tags in a web page. You can place
the <script> tags, containing your JavaScript, anywhere within your
web page.
Ex :- <script ...>
JavaScript code
</script>

JavaScript Values
In JavaScript, you can have two types of values.

 Fixed values (Literals)


 Variables (Dynamic values)

JavaScript Literals
In the below code, 20 is a Number literal and ‘Helloworld

’ is a string literal.

<html>
<body>
<script>
document.write(20); // Number Literal
document.write("<br />"); // To add line-break
document.write("Helloworld"); // String Literal
</script>
</body>
</html>

JavaScript Variables
In JavaScript, variables are used to store the dynamic data.

You can use the below keyword to define variables in JavaScript.

 var
 let
 const

<html>

<body>

<scprit>

Function getsum(first,second){

Var sum=firt * second ;

Document.write(“the sum of “+The sum of " + first + " and


" + second + " is " + sum);

Let first = 3;

Const second =4;

Getsum(first ,second);

</scprit>

</body>

</html>

4 .Introduction to document and window object


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-
scale=1.0">
<title>Document and Window Object Example</title>
<style>
/* CSS styling for the heading */
#heading {
font-family: Arial, sans-serif;
font-size: 24px;
color: blue;
}
</style>
</head>
<body>
<h1 id="heading">Hello, World!</h1>
<button id="changeTextButton">Change Text</button>

<script>
// Accessing the document object
const headingElement = document.getElementById('heading');

// Accessing the window object


const windowHeight = window.innerHeight;
const windowWidth = window.innerWidth;

// Adding event listener to the button to change text


const changeTextButton =
document.getElementById('changeTextButton');
changeTextButton.addEventListener('click', function() {
// Changing the text of the heading using the document
object
headingElement.textContent = 'Text Changed!';
// Applying CSS properties for the changed text
headingElement.style.color = 'red'; // Change text color
to red
headingElement.style.fontSize = '28px'; // Increase font
size
headingElement.style.fontWeight = 'bold'; // Make text
bold
});

// Displaying window dimensions using alert


alert(`Window width: ${windowWidth}, Window height: $
{windowHeight}`);
</script>
</body>
</html>

You might also like