Obligement - L'Amiga au maximum

Lundi 27 mars 2017 - 14:38  

Translate

En De Nl Nl
Es Pt It Nl


Rubriques

 · Accueil
 · A Propos
 · Articles
 · Galeries
 · Glossaire
 · Hit Parade
 · Liens
 · Liste jeux Amiga
 · Quizz
 · Téléchargements
 · Trucs et astuces


Articles

 · Actualité (récente)
 · Actualité (archive)
 · Comparatifs
 · Dossiers
 · Entrevues
 · Matériel (tests)
 · Matériel (bidouilles)
 · Points de vue
 · En pratique
 · Programmation
 · Reportages
 · Tests de jeux
 · Tests de logiciels
 · Tests de compilations
 · Articles divers

 · Articles in english
 · Articles in other languages


Twitter

Suivez-nous sur Twitter




Liens

 · Sites de téléchargements
 · Associations
 · Pages Personnelles
 · Moteurs de recherche
 · Pages de liens
 · Constructeurs matériels
 · Matériel
 · Autres sites de matériel
 · Réparateurs
 · Revendeurs
 · Presse et médias
 · Programmation
 · Développeurs logiciels
 · Logiciels
 · Développeurs de jeux
 · Jeux
 · Autres sites de jeux
 · Scène démo
 · Divers
 · Informatique générale


Jeux Amiga

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z


Trucs et astuces

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z


Glossaire

0, A, B, C, D, E, F,
G, H, I, J, K, L, M,
N, O, P, Q, R, S, T,
U, V, W, X, Y, Z


Partenaires

Annuaire Amiga

Amedia Computer

Relec

Hit Parade


Soutien

N'hésitez pas à soutenir le projet Obligement



Contact

David Brunet

Courriel

 


En pratique : HTML - premier script en JavaScript
(Article écrit par Philippe Gaultier et extrait d'Amiga News - mai 1998)


Nous allons découvrir au fil de cette série comment quelques lignes de JavaScript peuvent être utilisées dans votre site Web. Le JavaScript n'étant qu'une "amélioration", tous les navigateurs pourront lire vos pages mais seuls ceux qui sont compatibles JavaScript utiliseront vos spécifications.

Le JavaScript c'est quoi ?

Contrairement à ce que pense beaucoup de monde, le JavaScript et le Java n'ont rien en commun. Le JavaScript est un langage interprété dont on glisse quelques lignes de code dans une page HTML afin de la rendre plus vivante, alors que le Java est un langage objet qui permet de développer des applications entières.

Le premier script

<HTML>
<HEAD>
<TITLE>Le premier Script</TITLE>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!-- On cache le code pour les navigateurs qui ne connaissent pas le JavaScript
document.write("Notre tout premier script")
// fin du script -->
</SCRIPT>
</BODY>
</HTML>

Examinons de plus près les différentes sections de cette page. Passons sur les balises HTML, que vous maîtrisez déjà parfaitement, pour disséquer le script proprement dit. Tout script (quel que soit son langage) commence par <SCRIPT ...> et se termine par </SCRIPT>.

SCRIPT language="argument" : argument prends ici la valeur "JavaScript". En effet, certains navigateurs peuvent prendre en charge d'autres langages tel que Visual Basic Script ou ActiveX.

Ensuite vient le corps du script encadré par une balise de début <!-- et une balise de fin --> qui cachent le corps du script aux navigateurs incapables de l'exécuter correctement.

Ici le corps se compose d'une seule instruction : document.write("Notre tout premier script") qui affiche sur un page HTML vierge :

Notre tout premier script

Attention, nous ne sommes pas en C, donc pas de point-virgule à la fin de la ligne.

Tout semble statique, quel avantage par rapport au HTML ? Pour l'instant ce petit script effectue la même chose que <P>Notre tout premier script <P> mais le JavaScript est un langage de programmation (simplifié certes) et non de description comme le HTML. Il faudra donc étoffer cette commande pour y voir une utilité.

Les fonctions et JavaScript

De là vient l'utilité des fonctions car tout langage de programmation se doit de pouvoir réagir aux événements de l'utilisateur.

<HTML>
<HEAD>
<TITLE>Réagir à une action</TITLE>
<SCRIPT>
function bonjour()
{
alert("Bonjour à tous !")
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="Cliquez ici" onclick="bonjour()">
</FORM>
</BODY>
</HTML>

Nous ne nous occuperons pas de la balise <FORM>...</FORM> qui permet de créer un bouton à cliquer (Denis Bucher le développera plus tard). Dans ce script nous avons créé une fonction bonjour(). Cette fonction n'est pas exécutée lors du chargement de la page HTML mais seulement lors d'un clic sur le bouton "Cliquez ici". En effet, l'événement onclick appelle la fonction bonjour() qui ouvre un boîte d'alerte avec le message : Bonjour à tous ! (figure 1). Par contre, sous Voyager, qui ne reconnaît pas le JavaScript, seul le bouton est affiché. Le JavaScript ne pollue pas notre page HTML (figure 2).

HTML

HTML

Soyons un peu plus dynamique !

Notre fonction affiche une boîte de dialogue, mais pour l'instant il n'est pas possible de réagir à tout événement sans écrire une pléiade de fonctions. Il faut donc écrire du code réutilisable. Il sera possible de réutiliser du code à condition de concevoir des fonctions "génériques" réagissant à des arguments tout comme dans les langages de haut niveau.

<HTML>
<HEAD>
<TITLE>Réagir à une action sans multiplier le nombre de fonctions</TITLE>
<SCRIPT> function bonjour(argument)
{
alert(argument)
}
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT TYPE="button" VALUE="Bonjour" onclick="bonjour('Bonjour à tous')">
<INPUT TYPE="button" VALUE="A bientôt" onclick="bonjour('A bientôt')">
</FORM>
</BODY>
</HTML>

On se rend compte que le JavaScript ressemble a du C interprété adapté à Internet. Ainsi, tout comme en C, il est possible de mettre plusieurs arguments séparés par une virgule.

C'est sympa mais que fait-on avec ?

Dans le présent article je vous ai présenté quelques fonctionnalités de JavaScript afin de vous donner un avant-goût de ce que l'on peut créer. A partir du mois prochain, nous nous plongerons plus en avant dans les objets reconnus par JavaScript ainsi que les structures de test. Nous suivrons la ligne tracée par mon collègue Denis Bucher. Nous verrons donc l'objet document et ce qui concerne les images.


[Retour en haut] / [Retour aux articles]