Web Technology Assignment - 3
Name:- Gaurav Sharma
Roll number:- 2100301530034
Class & section:- AIML Section-A
Q1. Develop a HTML and Javascript document to evaluate the root of quardic equation ?
Ans.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Quadratic Equation Solver</title>
<style>
body {
font-family: Arial, sans-serif;
.container {
max-width: 400px;
margin: 0 auto;
padding: 20px;
border: 1px solid #ccc;
border-radius: 5px;
background-color: #f9f9f9;
}
input[type="text"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
box-sizing: border-box;
input[type="button"] {
width: 100%;
padding: 10px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
input[type="button"]:hover {
background-color: #0056b3;
</style>
</head>
<body>
<div class="container">
<h2>Quadratic Equation Solver</h2>
<label for="coefA">Coefficient a:</label>
<input type="text" id="coefA" placeholder="Enter coefficient a">
<label for="coefB">Coefficient b:</label>
<input type="text" id="coefB" placeholder="Enter coefficient b">
<label for="coefC">Coefficient c:</label>
<input type="text" id="coefC" placeholder="Enter coefficient c">
<input type="button" value="Calculate" onclick="calculateRoots()">
<div id="result"></div>
</div>
<script>
function calculateRoots() {
var a = parseFloat(document.getElementById("coefA").value);
var b = parseFloat(document.getElementById("coefB").value);
var c = parseFloat(document.getElementById("coefC").value);
var discriminant = b * b - 4 * a * c;
if (discriminant > 0) {
var root1 = (-b + Math.sqrt(discriminant)) / (2 * a);
var root2 = (-b - Math.sqrt(discriminant)) / (2 * a);
document.getElementById("result").innerHTML = "Root 1: " + root1.toFixed(2) +
"<br>Root 2: " + root2.toFixed(2);
} else if (discriminant === 0) {
var root = -b / (2 * a);
document.getElementById("result").innerHTML = "Root: " + root.toFixed(2);
} else {
document.getElementById("result").innerHTML = "No real roots exist.";
</script>
</body>
</html>
Q2. Write a javscript to built up clock ?
Ans.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript Clock</title>
<style>
font-family: Arial, sans-serif;
font-size: 48px;
text-align: center;
margin-top: 100px;
</style>
</head>
<body>
<div id="clock"></div>
<script>
function updateClock() {
var currentTime = new Date();
var hours = currentTime.getHours();
var minutes = currentTime.getMinutes();
var seconds = currentTime.getSeconds();
hours = (hours < 10 ? "0" : "") + hours;
minutes = (minutes < 10 ? "0" : "") + minutes;
seconds = (seconds < 10 ? "0" : "") + seconds;
var timeString = hours + ":" + minutes + ":" + seconds;
document.getElementById("clock").innerText = timeString;
setInterval(updateClock, 1000);
updateClock();
</script>
</body>
</html>
Q3. Write difference between HTML and DHTML.
Ans.
HTML DHTML
• HTML is a markup language used • DHTML refers to a collection of
to create the structure and content technologies (HTML, CSS, and
of web pages. JavaScript) used together to create
• It provides a static representation interactive and dynamic web
of web content, defining elements pages.
like headings, paragraphs, links, • It allows elements on a web page
images, and more. to change or update in response
• HTML documents are typically to user actions or events without
static and don't change without requiring a page reload.
manual intervention or page • DHTML enables the creation of
reload. dynamic effects such as
animations, interactive menus,
drag-and-drop functionality, and
real-time updates.
• Key components of DHTML
include DOM (Document Object
Model) manipulation, CSS for
styling and layout, and JavaScript
for scripting interactivity.
Q4. Write about functions in javascript.
Ans. 1.) Function Declaration:
• Functions in JavaScript can be declared using the function keyword followed by a
name and a set of parentheses containing optional parameters.
For example: function greet(name) {
console.log("Hello, " + name + "!");
}
2.) Function Expression:
• Functions can also be defined using function expressions, where a function is
assigned to a variable.
For Example: setTimeout(function() {
console.log("This is an anonymous function.");
}, 1000);
3.) Anonymous Functions:
• Functions can be created without a name, known as anonymous functions. These
are often used as callback functions or immediately invoked function expressions
(IIFE)
4.) Arrow Functions:
• Introduced in ES6, arrow functions provide a concise syntax for writing functions.
They are especially useful for short, one-liner functions. For example: var add =
(a, b) => a + b;
5.) Parameters and Arguments:
• Parameters are variables listed as part of a function's declaration. Arguments are
the values passed to the function when it is called.
For example: function add(a, b) {
return a + b;
}
console.log(add(2, 3)); // Output: 5
6.) Return Statement:
• Functions can return a value using the return statement. If no return statement is
specified, the function returns undefined by default.
For example: function add(a, b) {
return a + b;
}
Q5. Explain primitive datatype in javascript ?
Ans. Primitive data types are passed by value in JavaScript, meaning that when you assign a
primitive value to a variable or pass it as an argument to a function, a copy of the value is
created.
1. Number: This data type represents numeric values, including integers and
floating-point numbers. Numbers are used for calculations, measurements, and
any other numerical operations.
2. String: Strings represent sequences of characters, such as text or symbols. They
are enclosed within single ('') or double ("") quotes. Strings are used for
representing textual data, such as names, messages, and content.
3. Boolean: Booleans represent logical values of true or false. They are often used in
conditional statements and comparisons to control the flow of the program.
4. Undefined: The undefined data type represents a variable that has been declared
but has not been assigned a value. It is also the default value of uninitialized
variables.
5. Null: Null represents the intentional absence of any value. It is often used to
signify that a variable or object property has no value assigned to it.
6. Symbol: Symbols are unique and immutable values that can be used as the keys
of object properties. They are primarily used to avoid naming conflicts in
JavaScript objects.
