Prototyp - Übersicht

Was ist ein Prototyp?

Prototype ist ein JavaScript-Framework, das die Entwicklung dynamischer Webanwendungen vereinfachen soll. Der Prototyp wurde von Sam Stephenson entwickelt.

Prototype ist eine JavaScript-Bibliothek, mit der Sie DOM auf sehr einfache und unterhaltsame Weise bearbeiten können, die auch sicher ist (browserübergreifend).

Scriptaculous und andere Bibliotheken wie Rico bauen auf den Grundlagen von Prototype auf, um Widgets und andere Endbenutzer- Inhalte zu erstellen.

Prototype - -

Erweitert DOM-Elemente und integrierte Typen mit nützlichen Methoden.
Integrierte Unterstützung für OOP im Klassenstil einschließlich Vererbung.
Hat erweiterte Unterstützung für das Event-Management.
Verfügt über leistungsstarke Ajax-Funktionen.
Ist kein vollständiges Framework für die Anwendungsentwicklung.
Bietet keine Widgets oder einen vollständigen Satz von Standardalgorithmen oder E / A-Systemen.

Wie installiere ich Prototype?

Der Prototyp wird als einzelne Datei mit dem Namen prototype.js verteilt. Führen Sie die folgenden Schritte aus, um die Prototypbibliothek einzurichten.

Gehen Sie zur Download-Seite (http://prototypejs.org/download/) , um die neueste Version in einem praktischen Paket zu erhalten.
Legen Sie nun die Datei prototype.js in einem Verzeichnis Ihrer Website ab, z. B. / javascript.

Sie können jetzt das leistungsstarke Prototype-Framework auf Ihren Webseiten verwenden.

Wie benutzt man die Prototyp-Bibliothek?

Jetzt können Sie das Prototyp- Skript wie folgt einfügen:

<html>
   <head>
      <title>Prototype examples</title> 
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
   </head>
   
   <body>
      ........
   </body>
</html>

Beispiel

Hier ist ein einfaches Beispiel, das zeigt, wie Sie die $ () - Funktion von Prototype verwenden können, um DOM-Elemente in Ihrem JavaScript abzurufen.

<html>
   <head>
      <title>Prototype examples</title>
      <script type = "text/javascript" src = "/javascript/prototype.js"></script>
      
      <script>
         function test() {
            node = $("firstDiv");
            alert(node.innerHTML);
         }
      </script>
   </head>

   <body>
      <div id = "firstDiv">
         <p>This is first paragraph</p> 
      </div>
      
      <div id = "secondDiv">
         <p>This is another paragraph</p>
      </div>
      
      <input type = "button" value = "Test $()" onclick = "test();"/>
   </body>
</html>

Ausgabe

Warum dieses Tutorial?

Eine sehr gute Dokumentation für Prototype Framework finden Sie unter prototypejs.org. Warum sollte man sich dann auf dieses Tutorial beziehen?

Die Antwort ist, dass wir in diesem Tutorial alle am häufigsten verwendeten Funktionen zusammengestellt haben. Zweitens haben wir alle nützlichen Methoden zusammen mit geeigneten Beispielen erläutert, die auf der offiziellen Website nicht verfügbar sind.

Wenn Sie ein fortgeschrittener Benutzer von Prototype Framework sind, können Sie direkt zur offiziellen Website springen. Andernfalls könnte dieses Tutorial ein guter Anfang für Sie sein und Sie können es wie ein Referenzhandbuch verwenden.