lOMloOAMRocPARScPD|S49D|11495181653863
LABORATORY MANUAL
WEB-TECHNOLOGY
CO-407
B-TECH
7TH SEMESTER
Submitted by:
ADARSH TIWARI (2K21/EE/19)
Submitted To:
Mr. Abhishek Maurya
Department of Information Technology
Delhi Technological University, Delhi-110042
lOMoAR cPSD| 49115863
INDEX
S.N Name of Practical Page No
1. Create a webpage with HTML describing your department. Use 04-08
paragraph and list tags. Apply various colors to suitably distinguish
key words. Also apply font styling like italics, underline to sentence
you find appropriate. Also use header tags. Insert an image and
create a link such that clicking on image takes user to other page.
Change the background color of the page. At the bottom create a
link to take user to the top of the page.
2. Design page that has 5 equal columns the table should look the same 09-12
in all screen resolution.
3. Design page that has 5 equal columns the table should look the same 13-16
in all screen resolution.
4. Write a HTML code to generate following output. Put validation 17-20
checks on values entered by the user using JavaScript like email
check and password and confirm password. Also change
background color after 5 seconds of page load.
5. Create an html page containing the polynomial expression as 21-22
follows
a0 + a1x+ a2x 2 + a3 x3
6. Write a HTML code to generate following output: Use of FrameSet. 23-25
lOMoAR cPSD| 49115863
7. Write a JavaScript program to display a hidden div (e.g. showing 26-27
stats of a player when user clicks on his name).
8. Write a JavaScript program to sort the items of an array. 28
9. Write a JavaScript program which accept a string as input and swap 29
the case of each character. For example if you input 'The Quick
Brown Fox' the output should be 'tHE qUICK bROWN fOX'.
10. Write a JavaScript function to hide email addresses to protect from 30
unauthorized user.
11. Write a JavaScript function to insert a string within a string at a 31
particular position.
12. Write a JavaScript function to check whether a given value is 32
hexadecimal value or not.
13. Write a JavaScript function to convert a decimal number to binary, 33-34
hexadecimal or octal number.
14. Write a merge sort program in JavaScript. 35-36
15. Write a JavaScript program to count number of words in string. 37
Note : -Remove white-space from start and end position. -Convert 2
or more spaces to 1. - Exclude newline with a start spacing.
lOMoAR cPSD| 49115863
Experiment-1
AIM: Create a webpage with HTML describing your department. Use paragraph and list tags.
Apply various colors to suitably distinguish key words. Also apply font styling like italics,
underline to sentence you find appropriate. Also use header tags. Insert an image and create
a link such that clicking on image takes user to other page. Change the background color of
the page. At the bottom create a link to take user to the top of the page.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Delhi Technological University - Computer Engineering
Department</title>
<style>
h1{
font-size: 36px;
font-weight: bold;
text-align: center;
}
p{
font-size: 20px;
line-height: 1.5;
text-align: justify;
}
.bold{
font-weight: bold;
}
.italic{
font-style: italic;
}
ul{
margin-left: 40px;
}
li{
margin-bottom: 10px;
}
lOMoAR cPSD| 49115863
#header{
background-color: #333;
color: #fff;
padding: 20px;
text-align: center;
}
#header a{
color: #fff;
text-decoration: none;
}
#header a:hover{
text-decoration: underline;
}
#image{
text-align: center;
margin-top: 20px;
}
#image img{
width: 200px;
height: 200px;
border-radius: 50%;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
#image img:hover{
transform: scale(1.1);
}
#top-link{
position: fixed;
bottom: 20px;
right: 20px;
padding: 10px;
background-color: #ffffff;
color: #ec0000;
font-size: 18px;
border-radius: 50%;
cursor: pointer;
transition: all 0.2s ease-in-out;
}
lOMoAR cPSD| 49115863
#top-link:hover{
transform: scale(1.1);
}
</style>
</head>
<body>
<div id="header">
<h1>Delhi Technological University</h1>
<p><i>Formerly known as Delhi College of Engineering</i></p>
<a href="#">Home</a> | <a href="#">About</a> | <a href="#">Contact</a>
</div>
<h1>Computer Engineering Department</h1>
<p>Delhi Technological University's <span class="bold">Computer Engineering
Department</span> is one of the most prestigious departments in the university.
The department offers both undergraduate and postgraduate programs in computer
engineering, with a focus on practical, hands-on learning.</p>
<p>The undergraduate program, <span class="italic">Bachelor of Technology in
Computer Engineering</span>, is a four-year program that covers a wide range of
topics, including programming, algorithms, data structures, computer networks,
database systems, and computer architecture. The program also includes a number
of electives that allow students to specialize in areas such as artificial
intelligence, machine learning, cybersecurity, and software engineering.</p>
<p>The postgraduate program, <span class="italic">Master of Technology in
Computer Engineering</span>, is a two-year program that is designed for students
who want to pursue advanced research in computer engineering. The program covers
advanced topics such as computer graphics, distributed systems, advanced
algorithms, and high-performance computing.</p>
<h2>Facilities</h2>
<ul>
<li>State-of-the-art computer labs</li>
<li>High-speed internet connectivity</li>
<li>Library with a vast collection of books, journals, and research
papers</li>
<li>Collaboration with industry partners for research and development
projects</li>
<li>Opportunities for students to participate in national and international
coding competitions</li>
</ul>
lOMoAR cPSD| 49115863
<div id="image">
<a href="[Link] src=" [Link]
alt="DTU Campus"></a>
</div>
<p>DTU's Computer Engineering Department is equipped with modern facilities and
resources to support research and learning. The department has a dedicated team
of faculty members who are experts in their respective fields and are committed
to providing quality education to their students.</p>
<p>The department also organizes various workshops, seminars, and guest lectures
by industry experts to keep the students updated with the latest trends and
technologies in the field of computer engineering.</p>
<p>Graduates from the Computer Engineering Department are in high demand in the
industry and have secured placements in top companies such as Microsoft, Amazon,
Google, and Facebook.</p>
<div id="top-link">
<a href="#">^</a>
</div>
</body>
</html>
lOMoAR cPSD| 49115863
Output:
lOMoAR cPSD| 49115863
Experiment-2
AIM: Design page that has 5 equal columns the table should look the same in all
screen resolution.
Code:
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="./[Link]">
<style>
* {
margin: 0;
padding: 0;
}
body {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
color: #fff;
background-color: black;
}
.table {
background-color: rgb(138, 47, 199);
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
padding: 2% 5%;
}
.column {
padding: 0 2%;
display: flex;
height: 100%;
flex-direction: column;
justify-content: space-between;
align-items: center;
lOMoAR cPSD| 49115863
border: 2px solid rgb(196, 190, 190);
}
.header, .data {
display: flex;
}
.header {
flex: 1;
}
.data {
flex: 4;
}
</style>
<title>Experiment 2</title>
</head>
<body>
<div class="table">
<div class="column">
<div class="header">
Column 1
</div>
<div class="data">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a
massa a est gravida gravida. Vivamus vel
sapien sem. Mauris condimentum massa a rhoncus placerat. Aenean
efficitur eget justo at iaculis. Integer
et dolor nisi. Sed consequat fermentum enim, ac sodales nisi
consequat vel. Nunc rhoncus porta elit a
egestas. Nulla gravida vitae nulla et eleifend. Vestibulum id leo
felis.
</div>
</div>
<div class="column">
<div class="header">
Column 2
</div>
<div class="data">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a
massa a est gravida gravida. Vivamus vel
sapien sem. Mauris condimentum massa a rhoncus placerat. Aenean
efficitur eget justo at iaculis. Integer
lOMoAR cPSD| 49115863
et dolor nisi. Sed consequat fermentum enim, ac sodales nisi
consequat vel. Nunc rhoncus porta elit a
egestas. Nulla gravida vitae nulla et eleifend. Vestibulum id leo
felis.
</div>
</div>
<div class="column">
<div class="header">
Column 3
</div>
<div class="data">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a
massa a est gravida gravida. Vivamus vel
sapien sem. Mauris condimentum massa a rhoncus placerat. Aenean
efficitur eget justo at iaculis. Integer
et dolor nisi. Sed consequat fermentum enim, ac sodales nisi
consequat vel. Nunc rhoncus porta elit a
egestas. Nulla gravida vitae nulla et eleifend. Vestibulum id leo
felis.
</div>
</div>
<div class="column">
<div class="header">
Column 4
</div>
<div class="data">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a
massa a est gravida gravida. Vivamus vel
sapien sem. Mauris condimentum massa a rhoncus placerat. Aenean
efficitur eget justo at iaculis. Integer
et dolor nisi. Sed consequat fermentum enim, ac sodales nisi
consequat vel. Nunc rhoncus porta elit a
egestas. Nulla gravida vitae nulla et eleifend. Vestibulum id leo
felis.
</div>
</div>
<div class="column">
<div class="header">
Column 5
</div>
<div class="data">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In a
massa a est gravida gravida. Vivamus vel
sapien sem. Mauris condimentum massa a rhoncus placerat. Aenean
efficitur eget justo at iaculis. Integer
lOMoAR cPSD| 49115863
et dolor nisi. Sed consequat fermentum enim, ac sodales nisi
consequat vel. Nunc rhoncus porta elit a
egestas. Nulla gravida vitae nulla et eleifend. Vestibulum id leo
felis.
</div>
</div>
</div>
</body>
</html>
Output:
lOMoAR cPSD| 49115863
Experiment-3
AIM: Write a HTML code for making table to containing different option for different
questions:
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>* {
margin: 0;
padding: 0;
font-family: 'Lato', Arial, Helvetica, sans-serif;
color: #fff;
font-size: 20px;
}
html {
height: 100vh;
}
body {
background-color: #19151a;
height: 100%;
display: flex;
flex: 1;
justify-content: center;
align-items: center;
}
lOMoAR cPSD| 49115863
table {
border: 2px solid #fff;
padding: 10px;
}
td, th {
padding: 10px;
}
tr:nth-child(even) {
background-color: #8a2b92;
}
tr {
background-color: #5a165f;
}</style>
<link
href="[Link]
rel="stylesheet">
<title>Experiment 3</title>
</head>
<body>
<table>
<tr>
<th>
Which is your favourite colour?
</th>
<th>
Who is your national leader?
</th>
<th>
Who has the highest test centuries in India?
</th>
</tr>
<tr>
<td>
Red
</td>
<td>
Sardar Patel
</td>
<td>
Kapil Dev
</td>
lOMoAR cPSD| 49115863
</tr>
<tr>
<td>
Green
</td>
<td>
Gandhiji
</td>
<td>
Sachin Tendulkar
</td>
</tr>
<tr>
<td>
Yellow
</td>
<td>
Indiraji
</td>
<td>
Sunil Gawaskar
</td>
</tr>
<tr>
<td>
Blue
</td>
<td>
Nehruji
</td>
<td>
Ajay Jadeja
</td>
</tr>
</table>
</body>
</html>
lOMoAR cPSD| 49115863
Output:
lOMoAR cPSD| 49115863
Experiment-4
AIM: Write a HTML code to generate following output. Put validation checks on
values entered by the user using JavaScript like email check and password and confirm
password. Also change background color after 5 seconds of page load.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
<style>
body {
background-color: #eee;
}
form {
background-color: #fff;
padding: 20px;
margin: 50px auto;
width: 400px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
}
label {
display: inline-block;
width: 100px;
text-align: right;
margin-right: 10px;
}
input {
lOMoAR cPSD| 49115863
padding: 5px;
border-radius: 5px;
border: 1px solid #ccc;
margin-bottom: 10px;
width: 200px;
}
.error {
color: red;
font-style: italic;
}
button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
margin-right: 10px;
}
.bottom{
height: 20px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-top: 5px;
}
button[type="reset"] {
background-color: #f44336;
}
</style>
</head>
<body onload="changeBg()">
<form id="registration-form">
<label for="username">Username:</label>
<input type="text" id="username" name="username" required><br>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required><br>
<label for="confirm-password">Confirm Password:</label>
<input type="password" id="confirm-password" name="confirm-password"
required><br>
<label for="first-name">First Name:</label>
lOMoAR cPSD| 49115863
<input type="text" id="first-name" name="first-name" required><br>
<label for="last-name">Last Name:</label>
<input type="text" id="last-name" name="last-name" required><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required><br>
<label for="phone-no">Phone Number:</label>
<input type="text" id="phone-no" name="phone-no" required><br>
<label for="location">Location:</label>
<input type="text" id="location" name="location" required><br>
<div id="error-message"></div>
<div class="bottom">
<button type="button" onclick="validateForm()">Register</button>
<button type="reset">Reset</button>
</div>
</form>
<script>
function validateForm() {
let password = [Link]("password").value;
let confirmPassword = [Link]("confirm-
password").value;
let email = [Link]("email").value;
if (password !== confirmPassword) {
[Link]("error-message").innerHTML = "<p
class='error'>Passwords do not match</p>";
return;
}
if (!validateEmail(email)) {
[Link]("error-message").innerHTML = "<p
class='error'>Invalid email format</p>";
return;
}
[Link]("registration-form").submit();
}
function validateEmail(email) {
let emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
lOMoAR cPSD| 49115863
return [Link](email);
}
function changeBg() {
let colors = ["#0000FF", "#FFFFFF", "#800080", "#FF0000", "#0000FF"];
let i = 0;
setInterval(function() {
[Link] = colors[i];
i++;
if (i === [Link]) {
i = 0;
}
}, 5000);
}
</script>
</body>
</html>
Output:
lOMoAR cPSD| 49115863
Experiment-5
AIM: Create an html page containing the polynomial expression as follows
a0 + a1x+ a2x 2 + a3 x3
Code :
<!DOCTYPE html>
<html>
<head>
<title>Experiment 5</title>
<style>
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
font-size: 18px;
line-height: 1.5;
margin: 0;
padding: 0;
}
#equation {
background-color: #fff;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
margin: 50px auto;
max-width: 600px;
padding: 20px;
text-align: center;
}
h1 {
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
}
p {
margin: 0;
}
.sub {
font-size: 14px;
}
.sup {
font-size: 14px;
margin-left: 5px;
position: relative;
lOMoAR cPSD| 49115863
top: -5px;
}
</style>
</head>
<body>
<div id="equation">
<h1>Experiment 5</h1>
<p>Here is an equation:</p>
<p>a<sub class="sub">0</sub> + a<sub class="sub">1</sub>x + a<sub
class="sub">2</sub>x<sup class="sup">2</sup> + a<sub class="sub">3</sub>x<sup
class="sup">3</sup></p>
</div>
</body>
</html>
Output:
lOMoAR cPSD| 49115863
Experiment-6
AIM: Write a HTML code to generate following output:
Code:
<!DOCTYPE html>
<html>
<head>
<title>EXPERIMENT 6 </title>
<style>
body {
margin: 0;
padding: 0;
}
.container {
display: flex;
flex-direction: row;
height: 100vh;
}
.section {
display: flex;
justify-content: center;
align-items: center;
}
.[Link] {
width: 40%;
flex-direction: column;
}
.[Link] .inner-section {
height: 100%;
width: 100%;
lOMoAR cPSD| 49115863
border: 1px solid black;
display: flex;
justify-content: center;
align-items: center;
}
.[Link] .inner-section:first-child {
border-bottom: none;
height: 60%;
width: 100%;
}
.[Link] {
width: 60%;
background-color: lightgray;
}
</style>
</head>
<body>
<div class="container">
<div class="section left">
<div class="inner-section">1</div>
<div class="inner-section">2</div>
</div>
<div class="section right">3</div>
</div>
</body>
</html>
lOMoAR cPSD| 49115863
Output:
lOMoAR cPSD| 49115863
Experiment-7
AIM: Write a JavaScript program to display a hidden div (e.g. showing stats of a
player when user clicks on his name).
Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Experiment 7</title>
</head>
<body>
<div>
<h3>Cricket Players</h3>
<ul>
<li><a href="#" onclick="showStats(0)">Virat Kooli</a></li>
<li><a href="#" onclick="showStats(1)">Ben Stokes</a></li>
<li><a href="#" onclick="showStats(2)">AB Kejuliar</a></li>
<li><a href="#" onclick="showStats(3)">R Ashwin</a></li>
<li><a href="#" onclick="showStats(4)">DJ Pritam</a></li>
</ul>
</div>
<div id="stats" style="display:none;"></div>
</body>
<script>
var players = [
{ name: "Virat Kooli", runs: 500, wickets: 20, catches: 10 },
{ name: "Ben Stokes", runs: 750, wickets: 10, catches: 5 },
{ name: "AB Kejuliar", runs: 1000, wickets: 15, catches: 20 },
{ name: "R Ashwin", runs: 300, wickets: 25, catches: 12 },
{ name: "DJ Pritam", runs: 200, wickets: 5, catches: 2 },
];
function showStats(playerIndex) {
var player = players[playerIndex];
var statsDiv = [Link]("stats");
[Link] = "<h3>" + [Link] + " Stats</h3>";
[Link] += "<p>Runs: " + [Link] + "</p>";
[Link] += "<p>Wickets: " + [Link] + "</p>";
lOMoAR cPSD| 49115863
[Link] += "<p>Catches: " + [Link] + "</p>";
if ([Link] === "none") {
[Link] = "block";
}
}
</script>
</html>
Output:
lOMoAR cPSD| 49115863
Experiment-8
AIM: Write a JavaScript program to sort the items of an array.
Code:
let items = [
{ name: "Product A", type: "Type 1", date: "2022-01-01", price: 20.99 },
{ name: "Product B", type: "Type 2", date: "2021-12-31", price: 15.49 },
{ name: "Product C", type: "Type 3", date: "2022-01-15", price: 10.99 },
{ name: "Product D", type: "Type 1", date: "2022-02-01", price: 25.99 },
{ name: "Product E", type: "Type 2", date: "2022-03-01", price: 5.99 },
];
function sortItemsByPrice(items) {
[Link](function (a, b) {
return [Link] - [Link];
});
[Link](items);
}
sortItemsByPrice(items);
Output: Products are sorted based on their price
lOMoAR cPSD| 49115863
Experiment-9
AIM: Write a JavaScript program which accept a string as input and swap the case of
each character. For example if you input 'The Quick Brown Fox' the output should be
'tHE qUICK bROWN fOX'.
Code:
const swapCase = (str) => {
let ans = "";
for (const x of str) {
if (x === [Link]()) {
ans += [Link]();
} else {
ans += [Link]();
}
}
return ans;
};
let inputStr = "Delhi Technological University";
[Link](inputStr);
let swappedStr = swapCase(inputStr);
[Link](swappedStr);
Output:
lOMoAR cPSD| 49115863
Experiment-10
AIM: Write a JavaScript function to hide email addresses to protect from
unauthorized user.
Code:
const hideEmail = (email) => {
let parts = [Link]("@");
let username = parts[0];
let domain = parts[1];
let numHiddenChars = [Link](0, [Link]([Link] / 2));
let hiddenUsername =
[Link](0, 2) +
"*".repeat(numHiddenChars) +
[Link](2 + numHiddenChars);
return hiddenUsername + "@" + domain;
};
let email = "himanshu32288@[Link]";
[Link](email);
let hiddenEmail = hideEmail(email);
[Link](hiddenEmail);
Output:
lOMoAR cPSD| 49115863
Experiment-11
AIM: Write a JavaScript function to insert a string within a string at a particular
position.
Code:
let originalString = "Hello, world!";
let stringToInsert = "beautiful ";
let position = 7;
function insertString(originalString, stringToInsert, position) {
if (position > [Link]) {
return originalString + stringToInsert;
} else {
return (
[Link](0, position) +
stringToInsert +
[Link](position)
);
}
}
let newString = insertString(originalString, stringToInsert, position);
[Link](newString);
Output:
lOMoAR cPSD| 49115863
Experiment-12
AIM: Write a JavaScript function to check whether a given value is hexadecimal
value or not.
Code:
function isHexadecimal(num) {
const hexRegex = /^[0-9A-Fa-f]+$/g;
return [Link](num);
}
let num1 = "ABC123";
let num2 = "123XYZ";
[Link](isHexadecimal(num1)); // true
[Link](isHexadecimal(num2)); // false
Output:
lOMoAR cPSD| 49115863
Experiment-13
AIM: Write a JavaScript function to convert a decimal number to binary,
hexadecimal or octal number.
Code:
const decimalToBinary = (decimalNum) => {
let binaryArr = [];
while (decimalNum > 0) {
[Link](decimalNum % 2);
decimalNum = [Link](decimalNum / 2);
}
return [Link]("");
};
let decimalNum = 42;
[Link]("Decimal:", decimalNum);
let binaryNum = decimalToBinary(decimalNum);
[Link]("Binary:", binaryNum);
const decimalToHexadecimal = (decimalNum) => {
let hexadecimalArr = [];
let remainder;
const HEX_DIGITS = "0123456789ABCDEF";
while (decimalNum > 0) {
remainder = decimalNum % 16;
[Link](HEX_DIGITS[remainder]);
decimalNum = [Link](decimalNum / 16);
}
return [Link]("");
};
let hexadecimalNum = decimalToHexadecimal(decimalNum);
[Link]("Hexadecimal:", hexadecimalNum);
const decimalToOctal = (decimalNum) => {
let octalArr = [];
while (decimalNum > 0) {
[Link](decimalNum % 8);
decimalNum = [Link](decimalNum / 8);
}
lOMoAR cPSD| 49115863
return [Link]("");
};
let octalNum = decimalToOctal(decimalNum);
[Link]("Octal:", octalNum);
Output:
lOMoAR cPSD| 49115863
Experiment-14
AIM: Write a merge sort program in JavaScript.
Code:
const sortArray = (nums) => {
if ([Link] < 2) return nums;
let mid = [Link]([Link] / 2);
let left = [Link](0, mid);
let right = [Link](mid);
return merge(sortArray(left), sortArray(right));
};
const merge = (left, right) => {
let sortedArray = [];
while ([Link] && [Link]) {
if (left[0] <= right[0]) {
[Link]([Link]());
} else {
[Link]([Link]());
}
}
return [...sortedArray, ...left, ...right];
};
const list = [
79, 54, 37, 20, 66, 58, 91, 73, 50, 30, 17, 86, 12, 51, 39, 60, 80, 95, 6, 89,
];
const sortedArray = sortArray(list);
[Link]("Unsorted list:", list);
[Link]("Sorted list:", sortedArray);
lOMoAR cPSD| 49115863
Output:
lOMoAR cPSD| 49115863
Experiment-15
AIM: Write a JavaScript program to count number of words in string.
Note : -Remove white-space from start and end position. -Convert 2 or more spaces to
1. - Exclude newline with a start spacing.
Code:
const countWords = (str) => {
// Remove white-space from start and end position.
str = [Link]();
// Convert 2 or more spaces to 1.
str = [Link](/ +(?= )/g, "");
// Exclude newline with a start spacing.
str = [Link](/\n /g, "\n");
// Splitting string into array of words
let wordsArray = [Link](" ");
// Counting number of words
let wordCount = [Link];
return wordCount;
};
[Link](" Hello world");
[Link]("words:", countWords(" Hello world"));
Output: