0% found this document useful (0 votes)
20 views4 pages

AIT

Uploaded by

betusharb
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
20 views4 pages

AIT

Uploaded by

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

Q.

Explain <audio> and <canvas> tags in HTML5 with example


Both tags enhance multimedia and graphical content on modern web pages, making them dynamic and engaging
1.<audio> Tag: The <audio> tag is used to embed audio content in a web page.It supports multiple audio formats
like MP3, Ogg, and WAV. Attributes: controls: Adds playback controls (play, pause, volume). autoplay: Starts playing
the audio automatically. loop: Repeats the audio continuously. src: Specifies the audio file location.
html
<audio controls>
<source src="example.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
2.<canvas> Tag:The <canvas> tag is used to draw graphics on a web page using JavaScript. It provides a drawable
region defined by height and width. Common uses include rendering charts, graphs, or animations.
html
<canvas id="myCanvas" width="200" height="100" style="border:1px solid #000;"></canvas>
<script> Q. Define function in PHP.
const canvas = document.getElementById('myCanvas'); In PHP, the `define()` function is used to create a
const ctx = canvas.getContext('2d'); constant. A constant is an identifier for a value that
ctx.fillStyle = "blue";
cannot be changed during the execution of a script.
ctx.fillRect(50, 20, 100, 50);
</script> Constants are typically used to store values that
Q. write a minimal code to display string in uppercase remain the same, such as configuration settings.
and lowercase using angular js filters. Syntax:
<!DOCTYPE html> php
<html lang="en" ng-app="myApp"> define(name, value, case_insensitive = false);
<head>
<script src="https://ajax.googleapis.com Features:Constants are global and can be accessed
/ajax/libs/angularjs/1.8.2/angular.min.js"> anywhere in the script. They cannot be redefined or
</script>
undefined.Use Cases: 1.Storing configuration
</head>
<body ng-controller="myController"> values like database credentials. 2. Defining
<h2>AngularJS Uppercase and Lowercase Filters</h2> constant messages or settings across the
<label for="inputText">Enter Text:</label> application.
<input type="text" id="inputText" ng-model="text"><br> Example:
<p>Original: {{ text }}</p> php
<p>Uppercase: {{ text | uppercase }}</p> define("SITE_NAME", "My Website");
<p>Lowercase: {{ text | lowercase }}</p> echo SITE_NAME; // Outputs: My Website
</body>
<script> Q.Example of typescript
angular.module('myApp',
function [])
addNumbers(a: number, b: number):
.controller('myController',
number {function($scope) {
$scope.text = 'Helloreturn
AngularJS';
a + b;
});
}
</script>
</html> console.log("Sum =", addNumbers(5, 10));
Q.Php code to insert and display records on web page.
<?php Q.Code for Ngif, NgFor and NgSwitch.
$conn = new mysqli("localhost", "root", "", "test_db"); <div>
if ($_SERVER["REQUEST_METHOD"] === "POST") { <h2>*ngIf Example</h2>
$name = $_POST['name’];
$email = $_POST['email'];
<button (click)="toggle()">Toggle
Message</button>
$sql = "INSERT INTO students (name, email)
VALUES ('$name', '$email’)”; <p *ngIf="showMessage">This message is
if ($conn->query($sql) === TRUE) {
conditionally displayed using *ngIf.</p>
$last_id = $conn->insert_id; </div>
echo "Record inserted successfully with ID: $last_id";
} else {
echo "Error: " . $sql . "<br>" . $conn->error; <div>
}
} <h2>*ngFor Example</h2>
$result = $conn->query("SELECT * FROM students ");
?> <ul>
<!DOCTYPE html>
<li *ngFor="let item of items; let i = index">
<html lang="en"> {{ i + 1 }}. {{ item }}
<head>
<title>Insert Record</title> </li>
</head>
<body>
</ul>
<h2>Insert Student Record</h2> </div>
<form method="POST">

<label for="name">Name:</label>
<input type="text" name="name" id="name" required><br>
<div>
<label for="email">Email:</label> <h2>ngSwitch Example</h2>
<input type="email" name="email" id="email" required><br>
<button type="submit">Insert</button> <select [(ngModel)]="selectedColor">
</form>
<option value="red">Red</option>
<?php if ($result && $result->num_rows > 0): ?> <option value="blue">Blue</option>
<h3>Inserted Records:</h3>
</select>
<table border="1"> <div [ngSwitch]="selectedColor">
<tr>
<th>ID</th> <p *ngSwitchCase="'red'" style="color:
<th>Name</th>
<th>Email</th> red;">You selected Red.</p>
</tr> <p *ngSwitchCase="'blue'" style="color:
<?php while ($row = $result->fetch_assoc()): ?>
<tr> blue;">You selected Blue.</p>
<td><?php echo $row['id']; ?></td>
<td><?php echo $row['name']; ?></td> <p *ngSwitchDefault>Choose a color!</p>
<td><?php echo $row['email']; ?></td> </div>
</tr>
<?php endwhile; ?> </div>
</table>
<?php endif; ?>
</body>
</html>

<?php
$conn->close();
?>
Q. Write a code using <svg> tag to draw Q. Write a code using <canvas> tag to draw
lines, rectangle and triangle. lines, rectangle and circle.
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <body>
<title>SVG Shapes</title> <canvas id="myCanvas" width="300" height="200"
</head> style="border:1px solid
<body> black;"></canvas>
<h2>SVG Shapes Example</h2> <script>
<svg width="300" height="200" const canvas =
style="border: 1px solid black;"> document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');
<!-- Line --> // Draw a Line
<line x1="10" y1="10" x2="100" ctx.beginPath();
y2="10" stroke="blue" stroke-width="2" /> ctx.moveTo(10, 10);
ctx.lineTo(100, 10);
<!-- Rectangle --> ctx.stroke();
<rect x="10" y="20" width="80" height="50" // Draw a Rectangle
fill="green" stroke="black" stroke-width="2" /> ctx.strokeStyle = "black";
ctx.strokeRect(10, 20, 80, 50);
<!-- Triangle --> // Draw a Circle
<polygon points="150,10 120,60 180,60" fill="red" ctx.beginPath();
stroke="black" stroke-width="2" /> ctx.arc(150, 60, 30, 0, 2 * Math.PI);
</svg>
ctx.strokeStyle = "black";
</body>
ctx.stroke();
</html>
</script>
</body>
</html>
Q. code to show current date and time using user defined module in nodejs.
dateTimeModule.js
App.js
exports.getCurrentDateTime =
const dateTime = require('./dateTimeModule');
function () {
console.log("The current date and time is:",
return new Date().toLocaleString();
dateTime.getCurrentDateTime());
};

Running above as
node app.js
Output => The current date and time is: <Current Date and Time>
Q.Php code to display employees belong to IT department and salary is in between 50000 and
80000. Store output in other table.
<?php Q.Url module with Example.
$conn = new mysqli("localhost", "root", "", "test_db"); The `url` module in Node.js is used to parse, construct,
normalize, and manipulate URLs.
$query = "SELECT * FROM employees WHERE It provides utilities to handle URL strings and work with
department = 'IT' query parameters.
AND salary BETWEEN 50000 AND 80000"; Features:-1.Parsing URLs: Extract different parts of a
URL (protocol, host, pathname, query, etc.).2.Formatting
$result = $conn->query($query); URLs: Construct URLs from individual
components.3.Query String Handling: Work with query
if ($result->num_rows > 0) {
echo "<h2>Filtered Employees</h2>"; parameters using `searchParams`.
echo "<table border='1'> Ex.
<tr> const url = require('url');
<th>ID</th> const myUrl = new
<th>Name</th> URL('https://example.com:8080/path/page?
<th>Department</th> name=John&age=30');
<th>Salary</th> console.log('Protocol:', myUrl.protocol); // Output: https:
</tr>"; console.log('Host:', myUrl.host); // Output:
while ($row = $result->fetch_assoc()) { example.com:8080
echo "<tr>
<td>{$row['id']}</td> console.log('Pathname:', myUrl.pathname); // Output:
<td>{$row['name']}</td> /path/page
<td>{$row['department']}</td> Q.Php code to create/display multidimensional array
<td>{$row['salary']}</td> <?php
</tr>"; $employees = [
["name" => "Alice", "department" => "IT"],
$insertQuery = "INSERT INTO ["name" => "Bob", "department" => "HR",]];
filtered_employees (id, name, department, salary) echo "<h2>Employee Details</h2>";
VALUES ({$row['id']}, '{$row['name']}’, echo "<table border='1' cellpadding='5'>";
'{$row['department']}', {$row['salary']})";
$conn->query($insertQuery); echo "<tr><th>Name</th><th>Department</th>
} <th>Salary</th></tr>";
echo "</table>"; foreach ($employees as $employee) {
} else { echo "<tr>
echo "No employees found."; <td>{$employee['name']}</td>
} <td>{$employee['department']}</td>
$conn->close(); </tr>";
?> }
echo "</table>";
?>

You might also like