Bonjour     visiteurs jour : 108     Total clics   :   1347404

Les joies de l'informatique et de l'internet !





Coucou et merci


 
Clics 777

 

Introduction au DHTML

 

Le DHTML sert à rendre les éléments d'une page Web interactifs. Il permet de changer le style d'une balise sans recharger la page, d'ajouter ou de supprimer des textes, des balises ou et leurs attributs avec le langage JavaScript.

 

source : extraits commentés de wikiversity.org

 

Les évènements

Cliquer sur un lien, fermer une fenêtre, cliquer sur un bouton ou lorsque la page se charge sont des évènements qu'il est utile d'intercepter pour le cas échéant déclencher une action avec JavaScript.

 

Liste des détecteurs d'évènement JavaScript

onabort Se déclenche lorsque l'utilisateur stoppe le chargement de la page.
onblur un élément de la page perd le focus (l'utilisateur clique ailleurs).
onchange la valeur d'un champ de donnée voit sa valeur modifiée.
onclick Se déclenche lorsque l'utilisateur clique sur l'élément en question.
ondblclick Se déclenche lorsque l'utilisateur double-clique sur l'élément en question.
ondragdrop Se déclenche lorsque l'utilisateur glisse et dépose (drag and drop) un objet.
onerror Se déclenche lorsqu'une erreur apparaît sur la page (JavaScript 1.1).
onfocus Se déclenche lorsque l'utilisateur donne le focus à un élément (il clique dessus).
onkeydown Se déclenche lorsque l'utilisateur appuie une touche du clavier (JavaScript 1.2).
onkeypress Se déclenche lorsque l'utilisateur maintient une touche du clavier enfoncée.
onkeyup Se déclenche lorsque l'utilisateur relâche une touche du clavier (JavaScript 1.2).
onload Se déclenche lorsque l'utilisateur charge la page.
onmousedown l'utilisateur appuie sur un bouton de sa souris au-dessus d'un élément de la page.
onmouseout  l'utilisateur ne survole plus un élément de la page (JavaScript 1.1).
onmouseover Se déclenche lorsque l'utilisateur survole un élément de la page.
onmouseup l'utilisateur arrête d'appuyer sur un bouton de sa souris au-dessus d'un élément de la page. (Utilisé dans glisser déposer)
onreset l'utilisateur clique sur un input de type reset (réinitialisation d'un formulaire).
onresize Se déclenche lorsque l'utilisateur redimensionne la fenêtre actuelle.
onselect l'utilisateur sélectionne un texte dans un champ de type text ou textarea.
onsubmit l'utilisateur soumet un formulaire (soit clique sur bouton soit touche [enter]).
onunload Se déclenche lorsque l'utilisateur quitte la page actuelle.

 

 

Exemple : dire bonjour à l'ouverture de la page

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
function direBonjour() {
        alert('Bonjour à vous !');
}
</script>
</head>

<body onload="direBonjour();">
...

 

Reconnaissance à la volée

N'importe quel évènement peut  être intercepté "à la volée" depuis la balise <script>.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
window.onload = direBonjour;

function direBonjour() {
        alert('Bonjour à vous !');
}
</script>
</head>

<body>
...

 

 

 

DHTML

Vos messages sont modérés.   Les visiteurs non inscrits ont leur pseudo préfixé par x_.   Merci de respecter la loi et les personnes.

Votre message -->

Classement
par date
croissante.
décroissante.
Vous
inaugurez
ce forum,
félicitations.
Pseudo     Le 15-12-2019.   Titre  

 

Total des visiteurs  :    535372   dont aujourd'hui :   108    En ligne actuellement :  1      Total des clics   1347404