Source: http://tecfa.unige.ch/guides/js/pointers.html
Timestamp: 2017-01-18 16:17:11+00:00

Document:
Tecfa's JavaScript Page
Home [français] Search Portal Moodle TecfaX EduTech Wiki(en) EduTech Wiki(fr) Overview
Tecfa-Quick
Tecfa Servers
Gen.Pointers
Methodo |
Project Mgmt |
Misc.Soft |
TIE-slides |
X3D |
Xml/XSLT |
Xml/XQuery |
Xml/Contents |
InfoViz |
This is a short English / French page on JavaScript. Only sporadically maintainted !
§ 1.1 JavaScript Reference § 1.2 FAQs and Short References § 1.3 General on-line tutorials § 1.4 DOM tutorials § 1.5 Ajax and DHTML tutorials § 1.6 Client-side modifications Links
§ 2.1 Sites with javascript code Exemples
1.1 JavaScript Reference
JavaScript at Mozilla developper center (JS 1.5 + JS 1.6 updates)
JavaScript at Mozilla developper center (JS 1.5 + JS 1.6 updates) en français (moins complet ...)
OLD JavaScript 1.5 Guide. Can be used as Tutorial for the language only. Use a JS 1.2 or JS1.3 Guide for built-in traditional JavaScript objects, use the DOM specs for DOM objects.
OLD JavaScript 1.5 Reference Guide ECMA-262 Specification (PDF). ECMA Script is a standardized Core Version (e.g. without any browser objects) based on the JavaScript 1.1 Specification. ECMA Script is the formal basis for many scripting languages (JavaScript 1.5, SVG and VRML scripting, etc.)
W3C Document Object Model (DOM) Activity Statement (points to all relevant DOM documents: E.g. the
Document Object Model (DOM) Level 1 Specification a platform- and language-neutral interface that allows programs and scripts to dynamically access the content and structure of documents. Document Object Model (DOM) Level 2 Core Specification allows to update the structure of documents. ETC. History: For older NS 4.7+ browsers (but more practical than more modern DOM-less versions ...): JavaScript 1.3 Guide and JavaScript 1.3 Reference Guide - OUTDATED, but still on of the best references on how to use the "standard" JavaScript Objects.
History: For older NS 4.0 browsers: JavaScript 1.2 Guide - PDF Version and JavaScript 1.2 Reference Guide - (PDF Version)
Very old Web History (NS 1 & 2): JavaScript 1.0/1.1 Guide and Reference Manual - PDF (!) Version DOM Reference
Gecko DOM Reference Most Useful on 4/2006/ DKS
Gecko DOM Reference (french) Manuel très utile pour développer du JS/DOM (plus récent que les choses ci-dessus !) 4/2006/ DKS
1.2 FAQs and Short References
JavaScript Mini-FAQ by Danny Goodman (Goodman is author of a book on JavaScript. Danny Goodman's JavaScript and Browser Objects Quick Reference
1.3 General on-line tutorials
SELFHTML Tutorial by Stephan Münz (site central HTML/JS/DOM plusieurs langues)
SELFHTML JavaScript/DOM Tutorial by Stephan Münz (traduction française)
Articles spécialisés SELFHTML: JavaScript
Quirksmode CSS and Javascript tips by Peter Paul Koch. Tutorial and examples, Compatibility tables. Stefan Koch's Voodoo's Introduction to JavaScript. Ok pour JS ancien, pas actualisé pour DOM. Il existe une traduction française Introduction à JavaScript. (bien, mais daté (!)
Webmonkey: Javascript collection: links & tutorials (but too much advertising !)
JavaScript Tutorials @ builder.com, Introduction to the DOM of IE5 / NS6 JavaScript tutorials at webreference (Lots !)
Quelques tutoriels installés localement (il y a longtemps, à VERIFIER).
Beginner Tip: Form Processing Basics by Larisa Thomason, NetMechanic
1.4 DOM tutorials
1.5 Ajax and DHTML tutorials
Ajax (programming). Ajax or Asynchronous JavaScript and XML is a term describing a web development technique for creating interactive web applications (Wikipedia Article, 2005) Asynchronous JavaScript Technology and XML (AJAX) With Java 2 Platform, Enterprise Edition (!), technical Sun Developer Network article, June 2005)
AJAX : Demystifying the buzz for all platforms. @ Web Forefront Mai 2005. Short intro article Putting AJAX to work InfoWorld article, (mostly a product overview)
1.6 Client-side modifications
(needs some sorting)
2.1 Sites with javascript code
(see also tutorials above !)
jQuery jQuery is a JavaScript library that takes this motto to heart: Writing JavaScript code should be fun... (12/2006).
DMoz JavaScript (Big Index) JavaScript FAQ JavaScript 'No Content' web site (Includes FAQ related to JavaScript Dates, Forms, Frames, Images, Source Files, Layers, Links, Miscellaneous, Numbers, Strings, Tables, and Windows) (articles)
JavaScript Pro: FAQ, informations et ressources (niveau moyen)
Java Script Browser Sniffer from webreference.com, see also: Sniffing for Netscape 6 Doc JavaScript (advanced)
Dynamic Drive: DHTML et autres trucs non standard, à utiliser avec précaution
The JavaScript Source a nice resource with lots of Cut & Paste javascript examples
DevEdge Online Javascript. Main Javascript Page at Netscape:
Examples, newsgroups, manuals, etc. (RECOMMENDED but advanced)
(in french mostly / en français)
Vous pouvez voir une petite présentation (slides utilisés pour le cours UV22).
Javascript est un langage de scripting qui augmente les fonctionnalités du langage HTML et autres formats Internet. Il offre un certain degré d'interactivité ainsi que quelques effets intéressants. Ce langage a été développé par Netscape pour être utilisé dans leur browser (client-side) ou au niveau serveur (server-side). Nous nous intéressons ici au côté client de javascript.
Javascript n'a rien a voir avec Java (le langage de Sun). Les seuls points communs que l'on peut leur trouver est leur ressemblance syntaxique et leur capacité à délivrer un contenu "exécutable" à travers le réseau. Toutefois, on peut dire qu'ils se complètent relativement bien quant à leur fonctionnalités: javascript peut contrôler le comportement du browser et de son contenu mais il ne permet pas, par exemple, de gérer dynamiquement des objets graphiques, alors que java le permet.
Plus concrètement, javascript peut servir à:
Contrôler l'apparence et le contenu de documents HTML
Contrôler le comportement du browser, dans une certaine mesure (par exemple, il est possible de créer de nouvelles fenêtre, de les fermer, ...)
Interagir avec le contenu d'un fichier HTML, par exemple on peut compter le nombre de liens dans un fichier. Les tags des formulaires (text, checkbox, button, ...) permettent de lire ou écrire des valeurs de (et dans) ces champs
Lire et écrire la valeur de cookies pour générer dynamiquement des pages HTML
Faire des calculs, utiliser et traiter des variables de type date, ...
Staf 13: Bibliographie de base: ouverture d'une ptite fenètre avec un ancre interne passé en argument
Exemples Javascript I: Contient des exemples simples utilisés pour introduire les notions de base.
Exemples Javascript II: Contient entre
autre les exemples les plus importants du livre de Cohen, CGI/Perl et Javascript utilisé dans le cours.
(Cette page est protégée par le mot de passe STAF habituel pour des raisons de copyright)
Exemples III (répertoire) du Tecfa
Javascript Manuel.
La collection de Danny Goodman.
Java Script Made Easy!
(A useful collection of 123 JavaScripts with working examples and explicit directions. Topics include Mouse Tricks, User Info, Pull Down Surfing, Alerts, Buttons/Forms, Clocks And Date, Scrollers, Random Stuff and Misc)
Live Software's: resource center, quelques exemples (niveau avancé)
about javascript, a history and primary sources (peu d'info)
Browser Sniffer This JavaScript-enabled page sniffs out common browser environment variables useful for writing cross-browser scripts Que peut-on faire avec JavaScript ?
Il peut être intéressant d'intégrer javascript dans un cursus de formation à distance (tutoriel-web, en l'occurence pour
apprendre html, ici les tableaux) . Voir aussi le travail de 2 étudiants (futurs enseignants) dans le cadre du cours Médias et Informatique Avec JavaScript, on peut entre autres:
Connaitre précisément le browser utilisé
Créer des questionnaires à choix multiples relativement évolués
Exemple de QCM sur les SEAT
Générer simplement un qcm, sans savoir coder en javascript
la frame de navigation de ma homepage contient des images, dont la propriété src (l'adresse de l'image) varie avec le "gestionneur" d'événement OnMousOver (voir également le logo tecfa sur ma homepage
sur ma homepage, la date est affichée et, plus bas, un message concernant mon anniversaire; lorsque mon anni approche, le message change et fait un décompte (le jour fatidique, ma homepage n'est plus accessible, et une autre page rappelle à tous l'importance de ce jour)
on peut faire clignoter la page pendant qu'elle se charge, on peut afficher l'heure qui se met à jour régulièrement
une fonction qui retourne une couleur aléatoire (vachement utile ;)
Une fonction qui retourne un nombre aléatoire entre 1 et i
On peut ouvrir une nouvelle fenètre sans avoir besoin de cliquer (en l'occurrence une calculatrice écrite en JavaScript) ou encore vous faire changer de site (toujours sans cliquer ;)
On peut également faire scroller un message sur la widow.status bar (un peu stupide)
Un petit truc qui peut servir: si, dans la partie location (dans
laquelle s'affiche l'URL en cours), vous tapez javascript:votre_fonction,
ça permet de débuguer une ligne de code. Vous pouvez par
exemple essayer avec: javascript:alert(aujourdhui = new Date()).
Remarque: à la place de javascript, on peut écrire
mocha (utile pour java). On peut obtenir quelques informations sur votre browser et la version avec laquelle vous travaillez.
J'ai réuni quelques exemples de code que j'ai produit et qui peuvent servir tel quel (cut & paste)
Voici un code que j'aimerais bien avoir fait: une page qui vous permet de tester les couleurs en HTML
Comme dit plus haut, javascript ne permettrait pas, par exemple, de gérer un programme tel qu'un interfaçage de notre moo (alors que java le permet). Pour plus de détails concernant ces différences, voir la FAQ Java de IrtOrg
Exemples utiles pour l'exercice de programmation STAF-14
(sans mise à jour depuis plusieurs années !!)
Formulaire interactif (version "onClick")
Formulaire interactif (version qui interroge le formulaire)
Création d'une nouvelle fenêtre (avec formulaire et une ligne de texte)
Chatter Bot (regexp demo)
Exemples produits par nos étudiants (pas mis à jour depuis qq. années !!)
Exercice Javascript Staf-14: Voir les portefeuilles différentes Promotions
Boire ou conduire par Cyril Roiron: formulaire calcul avec instructions
Coût d'une voiture par Gael Jaboulay: formulaire calcul L'homme de votre vie par Anne Midenet: quiz avec images
Moo tutorial by Chris Muller: utilisation de JS dans un tutoriel
Budget familial par Benoit Dago: formulaire calcul Questionnaire sur la Poésie du XIXème siècle par Yasmin Shubber: quiz/test
Votre profil kiwajuniorien par Nathalie Pilard: test
Home Page de Cyril Roiron,
par exemple la barre de navigation ou l'image Tecfa au milieu de la page
Last modified: Tue Feb 12 14:33:57 CET 2008

References: § 1
 § 1
 § 1
 § 1
 § 1
 § 1

§ 2