Prototype - 概述

什么是 Prototype？

Prototype 是一个 JavaScript 框架，旨在简化动态 Web 应用程序的开发。Prototype 由 Sam Stephenson 开发。

Prototype 是一个 JavaScript 库，它使您可以非常轻松、有趣且安全（跨浏览器）的方式操作 DOM。

Scriptaculous 和其他库，例如 Rico，都基于 Prototype 的基础构建，用于创建小部件和其他最终用户内容。

Prototype −

扩展 DOM 元素和内置类型，提供实用方法。
内置支持类风格的面向对象编程，包括继承。
具有高级的事件管理支持。
具有强大的 Ajax 功能。
并非完整的应用程序开发框架。
不提供小部件或完整的标准算法或 I/O 系统。

如何安装 Prototype？

Prototype 以单个文件 prototype.js 的形式分发。请按照以下步骤设置 Prototype 库：

访问下载页面 (http://prototypejs.org/download/) 获取最新版本。
现在，将 prototype.js 文件放在网站目录中，例如 /javascript。

您现在可以在网页中使用强大的 Prototype 框架了。

如何使用 Prototype 库？

现在，您可以按如下方式包含 Prototype 脚本：

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

示例

这是一个简单的示例，展示了如何使用 Prototype 的 $() 函数在 JavaScript 中获取 DOM 元素：

<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>

输出

为什么需要本教程？

Prototype 框架的非常好的文档可在 prototypejs.org 找到，那么为什么还要参考本教程呢？

答案是：本教程将所有最常用的功能放在一起。其次，我们解释了所有有用的方法以及相应的示例，这些在官方网站上是找不到的。

如果您是 Prototype 框架的高级用户，则可以直接跳转到官方网站，否则本教程可以作为您的良好起点，并且您可以将其用作参考手册。

打印页面