1a.
Develop a JavaScript program to Capitalize the first letter of each Word of a sentence
(String)
function capitalizeFirstLetterOfEachWord(sentence) {
return sentence.split(' ').map(word => {
if (word.length > 0) {
return word[0].toUpperCase() + word.slice(1).toLowerCase();
} else {
return word;
}).join(' ');
const sentence = "hello world! this is a test.";
const capitalizedSentence = capitalizeFirstLetterOfEachWord(sentence);
console.log(capitalizedSentence);
1b .Develop a JavaScript program to Check a string starts with 'Java'.
function startsWithJava(str) {
return str.startsWith('Java');
// Example usage:
const testString1 = "JavaScript is a programming language.";
const testString2 = "I love Java and coffee.";
console.log(startsWithJava(testString1)); // Output: true
console.log(startsWithJava(testString2)); // Output: false
2b. Develop a JavaScript program to reverse a given string
function reverseString(str) {
return str.split('').reverse().join('');
// Example usage:
const originalString = "Hello, World!";
const reversedString = reverseString(originalString);
console.log(reversedString); // Output: !dlroW ,olleH
3a. Develop a JavaScript program to display a message using alert.
html
<!DOCTYPE html>
<html>
<head>
<title>Alert Example</title>
<script>
function showAlert(message) {
alert(mezssage);
</script>
</head>
<body>
<button onclick="showAlert('Hello, World!')">Click Me</button>
</body>
</html>
3b. Develop a JavaScript program to display a confirm message on a button click.
html
<!DOCTYPE html>
<html>
<head>
<title>Confirm Example</title>
<script>
function showConfirm() {
// Display a confirmation dialog
const userConfirmed = confirm("Are you sure you want to proceed?");
// Handle the user's response
if (userConfirmed) {
alert("User clicked OK.");
} else {
alert("User clicked Cancel.");
}
}
</script>
</head>
<body>
<button onclick="showConfirm()">Click Me</button>
</body>
</html>
3c. Develop a JavaScript program to read value through prompt window and display the
value on a button click.
html
<!DOCTYPE html>
<html>
<head>
<title>Prompt Example</title>
<script>
function showPrompt() {
// Display a prompt dialog to get user input
const userInput = prompt("Please enter your name:");
// Display the entered value on the web page
if (userInput !== null) {
document.getElementById("displayArea").innerText = `You entered: ${userInput}`;
} else {
document.getElementById("displayArea").innerText = "You canceled the prompt.";
}
}
</script>
</head>
<body>
<button onclick="showPrompt()">Click Me</button>
<div id="displayArea"></div>
</body>
</html>
4a. Develop a JavaScript program to display (on respective button clicks) multiplication and
division of two numbers. Read values from the textboxes and design two buttons (use DOM)
<!DOCTYPE html>
<html>
<head>
<title>Multiplication and Division</title>
<script>
function multiplyNumbers() {
const num1 = parseFloat(document.getElementById("number1").value);
const num2 = parseFloat(document.getElementById("number2").value);
// Check if the inputs are valid numbers
if (isNaN(num1) || isNaN(num2)) {
alert("Please enter valid numbers.");
return;
}
// Perform multiplication
const result = num1 * num2;
// Display the result
document.getElementById("result").innerText = `Result: ${result}`;
}
function divideNumbers() {
// Get the values from the textboxes
const num1 = parseFloat(document.getElementById("number1").value);
const num2 = parseFloat(document.getElementById("number2").value);
// Check if the inputs are valid numbers
if (isNaN(num1) || isNaN(num2)) {
alert("Please enter valid numbers.");
return;
}
// Check for division by zero
if (num2 === 0) {
alert("Division by zero is not allowed.");
return;
}
// Perform division
const result = num1 / num2;
// Display the result
document.getElementById("result").innerText = `Result: ${result}`;
}
</script>
</head>
<body>
<h2>Multiplication and Division</h2>
<div>
<label for="number1">Number 1:</label>
<input type="text" id="number1">
</div>
<div>
<label for="number2">Number 2:</label>
<input type="text" id="number2">
</div>
<div>
<button onclick="multiplyNumbers()">Multiply</button>
<button onclick="divideNumbers()">Divide</button>
</div>
<div id="result"></div>
</body>
</html>
4b. Develop a JavaScript program to highlight with red color the HTML links () having class
name “high” (use DOM)
<!DOCTYPE html>
<html>
<head>
<title>Highlight Links</title>
<style>
a{
color: initial;
}
</style>
</head>
<body>
<h2>Links</h2>
<a href="https://example.com" class="high">High Priority Link 1</a>
<a href="https://example.com">Normal Link 1</a>
<a href="https://example.com" class="high">High Priority Link 2</a>
<a href="https://example.com">Normal Link 2</a>
<script>
function highlightLinks() {
// Select all links with class 'high'
const highLinks = document.querySelectorAll('a.high');
// Change the color of the selected links to red
highLinks.forEach(link => {
link.style.color = 'red';
});
}
// Call the function to highlight the links
highlightLinks();
</script>
</body>
</html>
5a. Develop a JavaScript program to read the content of HTML paragraph and update (on
button click event) with the suitable Text read from the HTML Textbox (Use innerHTML)
<!DOCTYPE html>
<html>
<head>
<title>Update Paragraph</title>
</head>
<body>
<h2>Update Paragraph</h2>
<p id="paragraph">This is the initial content of the paragraph.</p>
<input type="text" id="textInput" placeholder="Enter new text">
<button onclick="updateParagraph()">Update</button>
<script>
function updateParagraph() {
const newText = document.getElementById('textInput').value;
document.getElementById('paragraph').innerHTML = newText;
}
</script>
</body>
</html>
5b. Develop a JavaScript program to check for an attribute (‘href’ in ) and get its
value/display on the Web page on a button click.
html
<!DOCTYPE html>
<html>
<head>
<title>Check href Attribute</title>
</head>
<body>
<h2>Check href Attribute</h2>
<a id="link" href="https://example.com">Example Link</a><br>
<button onclick="checkHrefAttribute()">Check href Attribute</button>
<div id="result"></div>
<script>
function checkHrefAttribute() {
const linkElement = document.getElementById('link');
const hrefValue = linkElement.getAttribute('href');
// Display the href attribute value on the web page
document.getElementById('result').innerText = `The value of href attribute is: $
{hrefValue}`;
}
</script>
</body>
</html>
6a. Develop a JavaScript program to sort a list of numbers (Use arrays and functions)
function sortNumbers(numbers) {
numbers.sort(function(a, b) {
return a - b;
});
return numbers;
const unsortedNumbers = [4, 2, 7, 1, 9, 5];
const sortedNumbers = sortNumbers(unsortedNumbers);
console.log(sortedNumbers); // Output: [1, 2, 4, 5, 7, 9]
6b. Develop a JavaScript program to create a hotel object using object literal syntax having
properties (name, location, room rate, discount etc), constructors and method (offer-price).
Create few objects to demonstrate the access of properties and an associated method
const hotel = {
name: "Grand Hotel",
location: "City Center",
roomRate: 200,
discount: 10,
offerPrice: function() {
const discountedPrice = this.roomRate - (this.roomRate * (this.discount / 100));
return discountedPrice;
}
};
// Accessing properties of the hotel object
console.log("Hotel Name:", hotel.name);
console.log("Location:", hotel.location);
console.log("Room Rate:", hotel.roomRate);
console.log("Discount:", hotel.discount + "%");
// Accessing the offerPrice method and displaying the discounted price
console.log("Offer Price:", hotel.offerPrice());
// Create another hotel object
const anotherHotel = {
name: "Ocean View Hotel",
location: "Beachfront",
roomRate: 250,
discount: 15,
offerPrice: function() {
const discountedPrice = this.roomRate - (this.roomRate * (this.discount / 100));
return discountedPrice;
}
};
console.log("\nHotel Name:", anotherHotel.name);
console.log("Location:", anotherHotel.location);
console.log("Room Rate:", anotherHotel.roomRate);
console.log("Discount:", anotherHotel.discount + "%");
console.log("Offer Price:", anotherHotel.offerPrice());
