JavaScript - Prototype de test


Test de la bibliothèque du framework JavaScript - Prototype

Prototype de référence

Pour tester une bibliothèque JavaScript, vous devez la référencer dans votre page web.

Pour référencer une bibliothèque, utilisez la balise <script> avec son attribut src défini sur l'URL de la bibliothèque :

Prototype de référence

<!DOCTYPE html> ;
<html>
<head>
<script
src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js" > ;
</script>
</head>
<body>
</body>
</html>

Description du prototype

Le prototype fournit des fonctions qui facilitent la programmation HTML DOM.

Semblable à jQuery, Prototype possède également sa propre fonction $(). La fonction

$() accepte la valeur id d'un élément HTML DOM (ou élément DOM) et ajoutera une nouvelle fonctionnalité à l'objet DOM.

Contrairement à jQuery, Prototype n'a pas de méthode ready() pour remplacer window.onload(). Au lieu de cela, Prototype ajoute des extensions au navigateur et au DOM HTML.

En JavaScript, vous pouvez attribuer une fonction pour gérer les événements de chargement de fenêtre :

Manière JavaScript :

fonction maFonction()
{
var obj=document.getElementById("h01");
obj.innerHTML="Bonjour Prototype";
}
onload=myFunction;

Le prototype équivalent est différent de :

Méthode prototype :

function myFunction()
{
$("h01").insert("Bonjour Prototype!");
}
Event.observe(window,"load",myFunction);

Event.observe() accepte trois paramètres :

  • Vous souhaitez Le DOM HTML ou un objet BOM (Browser Object Model) à gérer

  • L'événement que vous souhaitez gérer

  • La fonction que vous souhaitez appeler

Test du prototype

Veuillez essayer l'exemple suivant :

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js"></script>
<script>
function myFunction(){
	$("h01").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
	
<h1 id="h01"></h1>
</body>
	
</html>

Exécuter l'instance»

Cliquez sur le bouton « Exécuter l'instance » pour afficher l'instance en ligne

Veuillez réessayer cet exemple :

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<script src="http://apps.bdimg.com/libs/prototype/1.7.1.0/prototype.js"></script>
<script>
function myFunction(){
	$("h01").writeAttribute("style","color:red").insert("Hello Prototype!");
}
Event.observe(window,"load",myFunction);
</script>
</head>
<body>
<h1 id="h01"></h1>
</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne

Comme vous pouvez le voir dans l'exemple ci-dessus, comme jQuery, Prototype autorise la syntaxe de chaîne.

Le chaînage est un moyen pratique d'effectuer plusieurs tâches sur le même objet.