JavaScript - Test Prototype

Testen der JavaScript-Framework-Bibliothek - Prototype

Referenzieren von Prototype

Um eine JavaScript-Bibliothek zu testen, müssen Sie sie in einer Webseite referenzieren.

Um eine Bibliothek zu referenzieren, verwenden Sie das <script>-Tag, dessen src-Attribut auf die URL der Bibliothek gesetzt ist:

Referenzieren von Prototype

<!DOCTYPE html> <html> <head> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js"> </script> </head> <body> </body> </html>

Prototype-Beschreibung

Die von Prototype bereitgestellten Funktionen erleichtern die HTML-DOM-Programmierung.

Ähnlich wie jQuery hat Prototype auch seine eigene $()-Funktion.

Die $()-Funktion akzeptiert den id-Wert eines HTML-DOM-Elements (oder ein DOM-Element) und fügt dem DOM-Objekt neue Funktionalität hinzu.

Im Gegensatz zu jQuery verfügt Prototype nicht über eine ready()-Methode, um window.onload() zu ersetzen. Stattdessen fügt Prototype dem Browser und dem HTML-DOM Erweiterungen hinzu.

In JavaScript können Sie eine Funktion zuweisen, um das window-load-Ereignis zu behandeln:

JavaScript-Weg:

function myFunction() { var obj=document.getElementById("h01"); obj.innerHTML="Hello Prototype"; } onload=myFunction;

Der entsprechende Prototype-Ansatz ist anders:

Prototype-Ansatz:

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

Event.observe() akzeptiert drei Parameter:

  • Das HTML-DOM- oder BOM-Objekt (Browser Object Model), das Sie behandeln möchten
  • Das Ereignis, das Sie behandeln möchten
  • Die Funktion, die Sie aufrufen möchten

Prototype testen

Bitte versuchen Sie das folgende Beispiel:

Beispiel

<!DOCTYPE html> <html> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.js"> </script> <script> function myFunction() { $("h01").insert("Hello Prototype!"); } Event.observe(window,"load",myFunction); </script> </head> <body> <h1 id="h01"></h1> </body> </html>

Ausprobieren »

Bitte versuchen Sie dieses Beispiel erneut:

Beispiel

<!DOCTYPE html> <html> <script src="https://cdn.staticfile.org/prototype/1.7.3/prototype.min.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>

Testen Sie es »

Wie Sie in den obigen Beispielen sehen können, ermöglicht Prototype wie jQuery die Verkettungssyntax.

Verkettung ist eine bequeme Möglichkeit, mehrere Aufgaben an derselben Aufgabe auszuführen.

Andere Erweiterungen