lea.js
Version:
A Tiny Javascript Framework For Modern Browsers (And Developers)
147 lines (133 loc) • 6.78 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lea.js</title>
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/test.css">
<script data-main="assets/js/index" src="assets/js/require.js"></script>
<style type="text/css">
#obj{
position: absolute;
right: 20px;
bottom: 20px;
height: 40px;
width: 40px;
background-color: rgba(0,0,255,.4);
}
textarea{
overflow-y: scroll;
height: 150px;
}
</style>
</head>
<body>
<div class="container">
<div class="header clearfix">
<nav>
<ul class="nav nav-pills pull-right">
<li class="active"><a href="#">Summary</a></li>
<li ><a href="#">Official Website</a></li>
</ul>
</nav>
<h3 class="text-muted">Lea.js</h3>
</div>
<div class="content">
<form id="myForm" method="POST" action="ajax.json">
<p>
<label>
<input type="radio" name="form[rad]" value="RAD1"> Radio 1
</label>
<label>
<input type="radio" name="form[rad]" value="RAD2" checked> Radio 2
</label>
<label>
<input type="radio" name="form[rad]" value="RAD3"> Radio 3
</label>
</p>
<p>
<label>
<input type="checkbox" name="form[chk1]" checked> Check 1
</label>
<label>
<input type="checkbox" name="form[chk2]" checked> Check 2
</label>
<label>
<input type="checkbox" name="form[chk3]"> Check 3
</label>
</p>
<p>
<input type="text" name="form[txt1]" id="input">
<input type="text" name="form[txt2]" value="Hey what's up ?">
<input type="email" name="form[txt3]" value="sebastien.decamme@gmail.com">
<input type="password" name="form[txt4]" value="GreatPassword!">
</p>
<p>
<select name="form[sel]">
<option value="sel1" selected>Option 1</option>
<option value="sel2" selected>Option 2</option>
<option value="sel3" selected>Option 3</option>
<option value="sel4" selected>Option 4</option>
</select>
</p>
<p>
<textarea name="form[txtarea]">
Whoo!
What's so funny!
</textarea>
</p>
<button type="submit">Submit form</button>
</form>
<button type="button" id="btnApply">Apply Event</button>
<button type="button" id="btnTrigger">Trigger Event</button>
<button type="button" id="btnRemove">Remove Event</button>
<h3>Histoire</h3>
<p>
Le langage a été créé en 1995 par Brendan Eich pour le compte de la Netscape Communications Corporation, qui s'est inspiré de nombreux langages, notamment de Java mais en simplifiant la syntaxe pour les débutants.
</p>
<h3>LiveScript et Mosaic Communications Corporation</h3>
<p style="position:relative">
<img src="assets/img/2.jpeg" width="255" height="200" class="align-right img-thumbnail">
En décembre 1995, Sun et Netscape annoncent5 la sortie de JavaScript. En mars 1996, Netscape met en œuvre le moteur JavaScript dans son navigateur Web Netscape Navigator 2.0. Le succès de ce navigateur contribue à l'adoption rapide de JavaScript dans le développement web orienté client. Microsoft réagit alors en développant JScript, qu'il inclut ensuite dans Internet Explorer 3.0 en août 1996 pour la sortie de son navigateur.
<br>
Brendan Eich a initialement développé un langage de script côté serveur, appelé LiveScript, pour renforcer l'offre commerciale de serveur HTTP de Mosaic Communications Corporation. La sortie de LiveScript intervient à l'époque où le NCSA force Mosaic Communications Corporation à changer de nom pour devenir Netscape Communications Corporation.
<br>
Netscape travaille alors au développement d'une version orientée client de LiveScript. Quelques jours avant sa sortie, Netscape change le nom de LiveScript pour JavaScript. Sun Microsystems et Netscape étaient partenaires, et la machine virtuelle Java de plus en plus populaire. Ce changement de nom servait les intérêts des deux sociétés.
<span id="obj"></span>
</p>
<h3>Netscape et ECMAScript</h3>
<p>
<img src="assets/img/5.jpeg" width="255" height="200" class="align-left img-thumbnail">
En décembre 1995, Sun et Netscape annoncent5 la sortie de JavaScript. En mars 1996, Netscape met en œuvre le moteur JavaScript dans son navigateur Web Netscape Navigator 2.0. Le succès de ce navigateur contribue à l'adoption rapide de JavaScript dans le développement web orienté client. Microsoft réagit alors en développant JScript, qu'il inclut ensuite dans Internet Explorer 3.0 en août 1996 pour la sortie de son navigateur.
Netscape soumet alors JavaScript à Ecma International pour standardisation. Les travaux débutent en novembre 1996, et se terminent en juin 1997 par l'adoption du nouveau standard ECMAScript. Les spécifications sont rédigées dans le document Standard ECMA-262.
<br>
JavaScript est décrit comme un complément à Java dans un communiqué de presse5 commun de Netscape et Sun Microsystems, daté du 4 décembre 1995. Cette initiative a contribué à créer auprès du public une certaine confusion entre les deux langages, proches syntaxiquement mais pas du tout dans leurs concepts fondamentaux, et qui perdure encore aujourd'hui.
</p>
<h3>Mise en oeuvre</h3>
<p>
<img src="assets/img/1.jpeg" width="180" height="120" class="align-right img-thumbnail">
La troisième édition d'ECMAScript, parue en 1999 correspond à la version 1.5 de JavaScript. Sa mise en œuvre par Microsoft est JScript. Adobe pour sa part, met en œuvre ces spécifications dans son langage ActionScript.
<br>
SpiderMonkey est le nom de la mise en œuvre en langage C, sous la licence « MPL/GPL/LGPL tri-license », du langage JavaScript utilisé dans Gecko, le moteur de rendu développé par Mozilla.
<br>
Le langage a été créé en 1995 par Brendan Eich pour le compte de la Netscape Communications Corporation, qui s'est inspiré de nombreux langages, notamment de Java mais en simplifiant la syntaxe pour les débutants.
</p>
<h3>Hello world</h3>
<p>
Voici l'exemple classique du « Hello world » en JavaScript, lorsque l'application hôte est un navigateur Web.
</p>
<pre>alert("Hello world");</pre>
<p>
Dans l'application hôte, alert est une méthode de la classe DOM window, mais celle-ci étant récurrente, c'est une des seules classes dont on ne doit pas forcément préciser le nom pour utiliser ses méthodes.
</p>
<h3>La syntaxe</h3>
<pre>window.alert("Hello world");</pre>
</div>
</div>
<script>
requirejs(["main"]);
</script>
</body>
</html>