0% found this document useful (0 votes)
16 views8 pages

JavaScript Exercises for Web Development

Uploaded by

22x026
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
0% found this document useful (0 votes)
16 views8 pages

JavaScript Exercises for Web Development

Uploaded by

22x026
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

PSG College of Technology

Department of Applied Mathematics and Computational Sciences


[Link]. Computer Systems and Design
21X0A2 – Open Source Software
Problem Sheet 1 - Java Script

Start Date:19/06/2024 Dead line: 25/06/24

Note: Apply CSS to all Exercises.

1. Design a web page using HTML of TEXT Modification elements

High Flying

I gazed down into valleys,


At the snowcaps white as cream,
Then soared above the puffy clouds—
Too bad it was a dream!

High Flying

I gazed down into valleys,


At the snowcaps white as cream,
Then soared above the puffy clouds—
Too bad it was a dream!

High Flying

I gazed down into valleys,


At the snowcaps white as cream,
Then soared above the puffy clouds—
Too bad it was a dream!

2. Design a web page using HTML of Text Formatting tags

India Flag
The National flag of India has three equal horizontal
bands - the top panel is India saffron (Kesari), the bottom
panel is India green and white middle band bearing at its
centre the design of Ashoka Chakra in navy blue colour
with 24 equally spaced spokes. It was adopted by the
Constituent Assembly on 22nd July 1947, when it became
the official flag of the Dominion of India. The flag was
subsequently retained as that of the Republic of India.
The flag is based on the Swaraj flag, a flag of the Indian
National Congress designed by Pingali Venkayya.

3. Design a web page using HTML of Nested Lists

As listed in the Jackson Heights Journal, Jackson Heights


Middle School ranked 5th in the city-wide achievement test
given last week:

I. Oakfield Middle School


A. Tod Hastings
1. Math (#3)
2. History (#2)
3. Science (#2)
B. Bonita Chavez
1. Math (#1)
2. History (#4)
3. Science (#3)
II. Parkview Mid-High
A. Jacque Russell
1. Math (#2)
2. History (#5)
3. Science (#4)
B. Dwayne Clancy
1. Math (#4)
2. History (#7)

[Link] Definition lists


HTML
Hypertext Markup Language
TP
Transfer Protocol
FTP
File Transfer Protocol
HTTP
Hypertext Transfer Protocol
URL
Uniform Resource Locator (= web address)
WWW
World Wide Web
4. Take the TamilNadu map and perform the task of hovering over the district
on the map and displaying the information about the district, such as sweets /
population / hills / etc., using an image map.
5. Design a form using HTML and satisfy given constraints. Once submitting
the form, data should be displayed on another page / alert box.
6. Read data from users using the prompt box of JavaScript. Display the data
in the alert box.
Input: Welcome to java Script

Output: Welcome to java Script

8. Read three types of data from users using the prompt box of JavaScript.
Find the greatest among 3 numbers using the 'if' statement.
9. Write a JavaScript program which iterates the integers from 1 to 100. But
for multiples of three prints, "CAR" instead of the number, and for the
multiples of five prints, "BUS". For numbers which are multiples of both
three and five, print "CARBUS". The result shows on the screen.
[Link] a web page to convert miles to kilometers using JavaScript. Read
the data using a text box and display the output in the textbox.

Miles = km * 0.62137

Km= mi / 0.62137

[Link] a web page to convert Fahrenheit to Celsius using JavaScript.


Read the data using a text box and display the output in the textbox.

F= C * 9/5 +32

C= (F-32) *(5/9)

[Link] a simple calculator program using HTML and JavaScript


functions.
[Link] a JavaScript program to find the armstrong numbers of 3 digits.
Note: An Armstrong number of three digits is an integer such that the
sum of the cubes of its digits is equal to the number itself. For example,
371 is an Armstrong number :3**3 + 7**3 + 1**3 = 371.

14. Write a JavaScript for loop that will iterate from 0 to 15. For each
iteration, it will check if the current number is odd or even, and display a
message on the screen.
[Link] a JavaScript for loop that will iterate from 0 to 15. For each
iteration, it will check if the current number is odd or even, and display a
message on the screen.
Sample Output:
"0 is even"
"1 is odd"
"2 is even"
----------
----------
[Link] a JavaScript function that reverse a number.

Example x = 32243;
Expected Output : 34223

[Link] data from users using a prompt box. Display the output in the alert
box.

Input: Welcome to java Script

Output: Welcome to java Script

[Link] a JavaScript function to check if a given positive number is a


multiple of 3 or a multiple of 7. The result shows on the screen.
[Link] a JavaScript program that accepts two integers from the user and
calculates the sum of the two integers. Display the output in the textbox.
[Link] a web page to convert Fahrenheit to Celsius using JavaScript.
Read the data using a text box and display the output in the textbox.

F= C * 9/5 +32

C= (F-32) *(5/9)

21. Write a JavaScript for loop that will iterate from 0 to 15. For each iteration, it
will check if the current number is odd or even, and display a message to the
screen.
Sample Output :
"0 is even"
"1 is odd"
"2 is even"
----------
----------

22. Write a JavaScript function that reverses a given number. The result should
be shown in the alert box.
Example x = 32243;
Expected Output: 34223
23. Write a JavaScript program to read students’ marks for five subjects and
compute the average marks of the student. Then, this average is used to
determine the corresponding grade. Display the result in table format. Use
CSS and Table tag.

The grades are computed as follows:

Range Grade

<60 F

61-69 D

71- 79 C

81- 89 B

90-100 A

Each mark <50 result is “fail”, otherwise “Pass”.

Output:

Name Average marks Grade Pass/Fail

24. Write a JavaScript program to compute the perimeter and area of a rectangle
with a height of 7 inches and width of 5 inches.
25. Write a JavaScript program to compute the perimeter and area of a circle with
a given radius
[Link] a JavaScript program that accepts an employee's ID, total worked
hours of a month and the amount Rs. 50 he received per hour. Print the
employee's ID and salary for a particular month.
27. Write a Java script program that accepts three integers and find the maximum
of three.
28. Write a java script program to calculate a bike’s average consumption from
the given total distance travelled (in km) and spent fuel (in litres)

Test Data :
Input total distance in km: 350
Input total fuel spent in litres: 5
Expected Output:
Average consumption (km/lt) 70.000

29. Write a java script program to convert a given integer (in seconds) to hours,
minutes and seconds
30. Write a java script program to convert a given integer (in days) to years,
months and days, assumes that all months have 30 days and all years have
365 days.
31. Write a java script program to check whether a given integer is positive even,
negative even, positive odd or negative odd. Print even if the number is 0.
32. Write a Java script program to check whether a given number is even or odd.
33. Write a java script program to check whether a given number is positive or
negative.
34. Write a java script program to read the age of a candidate and determine
whether it is eligible for casting his/her own vote. (>18 casting vote)

35. Write a program in C to calculate and print the Electricity bill of a given
customer. The customer id., name and unit consumed by the user should be
taken from the keyboard and display the total amount to pay to the customer.
The charge are as follow:

Unit Charge/unit

upto 199 Rs.1.20

200 and above but less than 400 Rs.1.50

400 and above but less than 600 Rs.1.80

600 and above Rs2.00


If bill exceeds Rs. 400 then a surcharge of 15% will be charged and the
minimum bill should be of Rs. 100/-

Test Data :
1001
James
800
Expected Output :
Customer IDNO :1001
Customer Name :James
unit Consumed :800
Amount Charges Rs. 2.00 per unit: 1600.00
Surcharge Amount: 240.00
Net Amount Paid by the Customer: 1840.00

36. Write a java script program to find the sum of n natural numbers using for loop
37. Write a java script program to find the sum of positive number using while
loop
38. Write a java script program, to find a sum of digit using while loop.
39. Write a java script program to display 1 to 5 using do-while loop
40. Write a function that takes a number as an argument. If the number is even
return true. Otherwise, return false.

Common questions

Powered by AI

Using HTML and JavaScript to create interactive learning modules for mathematics offers significant educational benefits alongside some limitations. Benefits include enabling dynamic content that can adjust to user inputs, such as simulations or interactive problem-solving games, fostering active engagement and immediate feedback . JavaScript's ability to handle user input on-the-fly, validate solutions, and display step-by-step tutorials enhances learning through practice and visualization. Moreover, learners have flexible access through web browsers, facilitating widespread adoption. However, limitations include potential accessibility issues for students with disabilities if content is not designed inclusively. High dependence on device compatibility and internet access might also exclude some learners. Further, these modules require maintenance and accurate programming to avoid perpetuating incorrect academic information, necessitating ongoing oversight by educational professionals .

JavaScript can significantly enhance user interaction in web forms by providing real-time feedback, validating inputs, and improving user experience. For instance, using JavaScript, developers can validate form data on the client side before it's submitted to the server, ensuring data accuracy and completeness by checking fields like emails, phone numbers, or ensuring required fields are filled out . JavaScript can dynamically show feedback messages or highlight errors, improving the form's usability. Additionally, JavaScript can enhance interactivity by updating form contents in response to user actions without needing a page reload, using DOM manipulation techniques. This elevates web forms from being simple static elements to dynamic tools that can guide user actions smoothly .

CSS can be leveraged to enhance the readability and aesthetics of nested lists by applying specific styling rules that visually distinguish the different levels of hierarchy. Using nested lists, such as those created for school rankings , CSS can apply padding and indentation to clearly separate each list level, enhancing readability. Utilizing various list-style properties like custom bullets, numbers, or images can further differentiate list levels. Color schemes can also be assigned to different list items to provide better visual distinction. Adjusting font sizes and styles depending on the hierarchy level helps users quickly discern the structure and significance of information presented. These CSS techniques collectively improve the user experience by making complex information more accessible and visually organized .

JavaScript effectively transforms numerical inputs, such as converting miles to kilometers, by embedding interactive functionality in web pages. This can be accomplished by reading numerical data from an input field, applying the conversion factor (1 mile = 1.60934 kilometers), and outputting the result dynamically. By leveraging a text box for input and another for displaying the converted value, JavaScript's DOM manipulation can update the result in real time . Users enter miles, activate the conversion script, and instantly receive the kilometers equivalent, enhancing interactivity and utility without needing reloads or complex back-end processes. This straightforward processing encourages efficient, user-friendly data manipulation on modern web pages .

JavaScript's use of conditional logic is instrumental in creating dynamic web content that responds to user actions, significantly enhancing interactivity. Conditional statements like 'if', 'else if', and 'else' enable developers to execute different code paths based on user input or specific conditions . For example, using JavaScript to determine the greatest of three numbers or categorize numbers as even or odd adds tailored responses directly linked to user data. This capability not only enriches user experience through tailored feedback and personalization but also supports complex decision-making processes in interactive forms or games . However, overly complex conditional logic may reduce code readability and maintenance if not well-structured, requiring careful planning and testing to maintain program efficiency and user engagement .

To design a JavaScript program that determines if a number is an Armstrong number, a logical approach involves several key steps: first, understand what constitutes an Armstrong number—where the sum of the cubes of its digits equals the number itself. Next, develop a program that iterates through each digit of the given number, cubes it, and accumulates this cubed sum . This can be pragmatically implemented using JavaScript's loop and arithmetic operations. After computing the sum, compare it to the original number; if they match, identify it as an Armstrong number. Testing the logic with known Armstrong numbers like 371 helps ensure program accuracy, making this systematic approach vital for correct functionality .

When designing a webpage to display information about the Indian flag using HTML and CSS, semantic considerations include using appropriate HTML elements to convey the structure and meaning of the content. For instance, using the <header> element for the flag's title, <article> or <section> for detailed information such as its panels and the Ashoka Chakra, and <aside> for additional historical context enriches the semantic structure. CSS can visually distinguish these sections through background colors that mimic the flag's design: saffron, white, and green, providing not only visual appeal but also reinforcing meaning and organization . This semantic use enhances page accessibility and SEO, ensuring meaningful interpretation by both users and search engines.

An interactive JavaScript program for calculating geographical distances, such as miles to kilometers conversions, offers real-world benefits by providing immediate, precise distance measurements essential for travel and logistics. Such a program, often embedded within web and mobile applications, allows users to input their data, instantly convert distances using JavaScript's computation capabilities, and dynamically output results within interactive maps or GPS apps . This enhancement in usability translates to improved planning capabilities for users. The function's simplicity and speed bypass the need for manual calculation, thereby minimizing errors and streamlining tasks like route planning, fuel estimation, and resource allocation. These programs thus enhance decisions in navigation, supply chain management, and daily commuting, embedding essential efficiency in everyday geographical assessments .

To create a visually appealing presentation of a poem on a web page, HTML's text modification elements can be employed to emphasize certain parts of a poem like "High Flying." For instance, using headings for the title, paragraph tags for individual verses, and italics or bold to highlight specific lines or phrases can make the text stand out . Additionally, CSS can be applied to enhance visual style, such as setting the font family, adjusting line spacing, and utilizing colors and borders that resonate with the poem's themes . Implementing hover effects could also add interactivity, making a web page both aesthetically pleasing and engaging.

When designing a JavaScript program to calculate average grades based on multiple inputs, several considerations should be addressed. Firstly, ensure accurate data collection through user-friendly input fields for students’ marks. The program should validate these inputs to prevent entry of invalid data types or out-of-range values . Secondly, algorithmic precision is required to calculate the total and average, converting these results to a corresponding grade scale. This may involve implementing conditional statements to categorize average scores into predefined grade brackets accurately. Finally, consider displaying results in a clear, comprehensible format, such as tables enhanced with CSS for easy visualization, guaranteeing users grasp the grading outcome effectively . This holistic approach ensures functional accuracy while optimizing user interaction and experience.

You might also like