Scribd
Upload
2 views2 pages

Fiche TP N 03 Dev App Web

This document outlines a practical work assignment for 2nd year Computer Systems students at the University of Ain Témouchent, focusing on JavaScript application development. It includes objectives, definitions, and exercises that cover key JavaScript concepts such as functions, user interactions, and dynamic styling. The exercises require students to create functions for a multiplication table, prompt user input, and validate form fields with specific conditions.

Uploaded by

anesg491
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
2 views2 pages

Fiche TP N 03 Dev App Web

This document outlines a practical work assignment for 2nd year Computer Systems students at the University of Ain Témouchent, focusing on JavaScript application development. It includes objectives, definitions, and exercises that cover key JavaScript concepts such as functions, user interactions, and dynamic styling. The exercises require students to create functions for a multiplication table, prompt user input, and validate form fields with specific conditions.

Uploaded by

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

People's Democratic Republic of Algeria

Ministry of Higher Education and Scientific Research


Faculty of des Sciences and Technologies
University of Ain Témouchent Belhadj Bouchaib
MI Departement
2024-2025
Subject: Web Application Development Department of Mathematics and Computer Science
2nd Year Computer Systems

Practical Work n°3: Java script

Objectif :
The objective of this lab is to apply the key concepts you have learned about JavaScript during the course,
including variables, functions, predefined functions, loops, conditions, interactions, and forms

Number of sessions :1.5

Definition

JavaScript (JS) is an object-oriented scripting language based on the ECMAScript standard. It is embedded
within the (X)HTML code of a webpage, extending its capabilities and enhancing interactivity. This loosely
typed, object-oriented language is executed on the client side.

Notably, JavaScript can be used to handle styling in place of CSS (see Example 1). It also enables the
creation of interactive web pages and can be integrated with jQuery to manage events and create dynamic
animations.

Exercise 1:
Write a JavaScript function that displays the multiplication table of a given value passed as a parameter.
Before calling the function, the value must be entered through a dialog box.

Exercise 2:
Write a JavaScript script that, upon loading an HTML page, prompts the user for their name through a
dialog box and dynamically updates the browser's title bar with the entered name.

Styling with JavaScript

JavaScript allows you to dynamically modify the styling of your webpage, including changing the color
of an element, adjusting its position, resizing it, modifying its borders, hiding it, and much more.

Example 1 :

Supposant un élément dont l'id est <div id="example">Pif paf pouf</div>

La fonction getElementById(id) : renvoie l'élément dont l'id est id ;

Assuming an element with the ID: <div id="example">Pif paf pouf</div>

The getElementById(id) function returns the element with the given ID.

1/5
People's Democratic Republic of Algeria
Ministry of Higher Education and Scientific Research
Faculty of des Sciences and Technologies
University of Ain Témouchent Belhadj Bouchaib
MI Departement

example // We retrieve the element.


{ var elmt = document.getElementById("example");
background-color: #ff0; // style modification
color: #0f0; elmt.style.backgroundColor = "#ff0";
font-size: 1.2em; elmt.style.color = "#0f0";
text-align: center; elmt.style.fontSize = "1.2em";
} elmt.style.textAlign = "center";

CSS JS

Exercise 03 :
Q1. Create the form as shown in the image below.
Q2. Highlight any unfilled fields and display a message indicating that they are required.
Q3. If the user's age is below 12, display a message informing them that they cannot access the service
provided by the website.
Q4. Add a button to reset the form.

2/5

You might also like