`
seadragonnj
  • 浏览: 59020 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

prototype.js学习笔记

prototypeAjax设计模式F#浏览器 
阅读更多
prototype.js真是好东西,代码不多但作者的设计思路相当漂亮,简化了不少工作,至少可以减少30%的js代码,用facade模式把一些浏览器之间不兼容的问题隐藏掉,简化了不少工作;

$() 相当于documnet.getElementById()
js 代码
 
  1.   
  2.   
  3.   
  4. <script src=<span class="string">"prototype-1.4.0.js"></script>  
  5.   
  6. <script>  
  7.     function test1()  
  8.     {  
  9.         var d = $('myDiv');  
  10.         alert(d.innerHTML);  
  11.     }  
  12.   
  13.     function test2()  
  14.     {  
  15.         var divs = $('myDiv','myOtherDiv');  
  16.         for(i=0; i<divs.length; i++)  < span="">
  17.         {  
  18.             alert(divs[i].innerHTML);  
  19.         }  
  20.     }  
  21. </script>  
  22.   
  23.   
  24.   
  25.     
  26.            
  27.     
  

   
$F()用来取得输入框中的值,注意只要标签有value这个属性$F()就是取得它的值,不过是用在取输入框中的值的情况最多了

js 代码

 
  1. <script>  
  2. function test3()  
  3. {  
  4. alert(  $F('userName')  );  
  5. }  
  6.   
  7. </script>  
  8.   

$A()用来把一个传进来的参数转化为一个Array,
js 代码
 
  1. <script>  
  2.   
  3. function showOptions(){  
  4. var someNodeList = $('lstEmployees').getElementsByTagName('option');  
  5. var nodes = $A(someNodeList);  
  6.   
  7. nodes.each(function(node){  
  8. alert(node.nodeName + ': ' + node.innerHTML);  
  9. });  
  10. }  
  11. </script>  
  12.   
  17.   
  18.   

$H()方法把对象转化成可枚举的貌似联合数组Hash对象。

 

js 代码
  1. <script>  
  2. function testHash()  
  3. {  
  4. //let's create the object创建对象  
  5. var a = {  
  6. first: 10,  
  7. second: 20,  
  8. third: 30  
  9. };  
  10.   
  11. //now transform it into a hash转为Hash  
  12. var h = $H(a);  
  13. alert(h.toQueryString()); //转为字符串，哈哈哈可以使用Ajax方式把这个对象的属性传到后台了displays: first=10&second=20&third=30  
  14. }  
  15.   
  16. </script>  
下面说一下今天最后要说的最后一个函数：$R()

 

js 代码
 
  1. <script>  
  2. function demoDollar_R(){  
  3. var range = $R(10, 20, false);  
  4. range.each(function(value, index){  
  5. alert(value);  
  6. });  
  7. }  
  8.   
  9. </script>  
  10.   

 

<script>
    function testHash()
    {
        //let's create the object
        var a = {
            first: 10,
            second: 20,
            third: 30
            };

        //now transform it into a hash
        var h = $H(a);
        alert(h.toQueryString()); //displays: first=10&second=20&third=30
    }

</script>

分享到：
| JDBC连接MySQL
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    prototype.js开发笔记

    ### Prototype.js 开发笔记知识点详解 #### 1.1 Prototype.js 是什么？ Prototype.js 是一个由 Sam Stephenson 开发的 JavaScript 库。该库的主要目的是简化 Web 应用程序的开发过程，尤其针对那些需要高度交互性...

    prototype 开发应用手册，笔记，prototype.js文件下载

    《Prototype开发应用手册：深入解析与实践》 Prototype是一个强大的JavaScript库，由Sam Stephenson创建，旨在提升...通过学习和掌握Prototype，开发者可以更好地驾驭JavaScript，创造出更具交互性的Web应用。

    prototype.js开发手册

    这些笔记对于初学者和经验丰富的开发者来说都是宝贵的资源，能帮助他们更好地理解和运用Prototype.js库。 ### 4. 说明.txt 这个文件可能是对整个压缩包的简短介绍，或者对如何使用这些文档进行说明。它可能包括...

    prototype.js框架资料

    而“prototype_js　1_4版开发者手册 - Lyn-事繁勿慌，事闲勿荒，取象于取，外圆内方 - 博客园.mht”和“compdoc2cn prototype_js开发笔记.mht”是两篇开发者撰写的笔记和手册，提供了个人实践经验和深入理解。...

    prototype.js中文开发笔记(CHM)

    或许你还没有用过它， prototype.js 是一个由Sam Stephenson写的JavaScript包。这个构思奇妙编写良好的一段兼容标准的一段代码将承担创造胖客户端， 高交互性WEB应用程序的重担。轻松加入Web 2.0特性。 &lt;br...

    prototype中文帮助文档

    prototype.js开发笔记 prototype.js是一个非常优雅的javascript基础类库，对javascript做了大量的扩展，而且很好的支持Ajax，国外有多个基于此类库实现的效果库，也做得很棒。 prototype.js不仅是一个有很大实用...

    Prototype API

    "prototype.js 1.4.0 开发笔记中文版"很可能提供了针对该版本的详细解读和开发实践，对于学习和理解Prototype API 的具体用法和最佳实践非常有帮助。 综上所述，Prototype API 和 Scriptaculous 提供了丰富的...

    prototype1.4.0开发笔记

    万一你没有使用过大名鼎鼎的prototype.js，那么让我来告诉你，prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙，而且兼容标准的类库，能帮助你轻松建立有高度互动的web2.0特性的富客户端页面。...

    js 笔记 javascript 学习笔记

    本学习笔记将深入探讨JavaScript的核心概念，包括变量、数据类型、操作符、控制流程、函数、对象、数组、原型链、闭包等，并结合实际示例，如my.js、order.js、login.js等文件，来讲解其在实际项目中的应用。...

    prototype+开发笔记

    在JavaScript的世界里，`Prototype`是一个非常重要的概念，它构成了JavaScript面向对象编程的基础。...通过阅读`prototype.js`的源码和`说明文档.doc`，我们可以深入学习这一核心概念，并将其运用到实际项目中。

    Prototype学习笔记（一）（二）

    Prototype学习笔记（一）（二）涵盖了这一主题的深入探讨，旨在帮助开发者更好地理解和利用这个特性。在本篇文章中，我们将详细阐述Prototype的核心概念、作用以及如何在实际编程中应用。 首先，Prototype是...

    JavaScript学习笔记之ES6数组方法_.docx

    在JavaScript的世界里，ES6（ECMAScript 6）是一个重要的里程碑，引入了许多新的特性，尤其是在数组处理方面。本文将详细解析ES6中为数组添加的一些关键方法，这些方法极大地提升了开发者的效率，并且在现代浏览器和...

    Prototype开发笔记.doc

    总结起来，《Prototype开发笔记》是学习和理解Prototype框架的重要资源，它涵盖了从基本的DOM操作到复杂的Ajax交互，以及JavaScript语言的扩展和增强。通过深入学习这份笔记，开发者能够有效地利用Prototype来构建...

    Prototype学习笔记（最新整理）

    ### Prototype学习笔记（最新整理） #### 1. Prototype是什么？ Prototype是一个由Sam Stephenson编写的JavaScript库，旨在简化客户端脚本编程，使开发者能够轻松创建动态的、交互式的Web应用程序。该库通过提供一...

    prototype学习笔记

    在JavaScript中，`prototype`是一个核心...总的来说，这篇"prototype学习笔记"深入讲解了JavaScript中的原型和继承机制，结合源码分析和实用工具，帮助开发者更全面地掌握这一核心概念，并能够在实际项目中灵活运用。

    javascript学习笔记.docx

    这篇学习笔记主要涵盖了JavaScript的基础语法和客户端JavaScript的相关知识。 1. **JavaScript基本语法**： - **变量声明**：未声明的变量尝试读取时会产生错误，而写入未声明的变量会创建一个全局变量。 - **...

Magicbox
Global site tag (gtag.js) - Google Analytics