精华内容
参与话题
问答
  • Prototype js library

    2019-06-28 09:38:00
    Prototype An object-oriented JavaScript framework Prototype is a JavaScript framework that aims to ease development of dynamic web applications. It offers a familiar class-style OO framework, extens...

    Prototype

    An object-oriented JavaScript framework

    Prototype is a JavaScript framework that aims to ease development of dynamic web applications. It offers a familiar class-style OO framework, extensive Ajax support, higher-order programming constructs, and easy DOM manipulation.

     

    Using Prototype

    To use Prototype in your application, download the latest release from the Prototype web site (http://prototypejs.org/download) and copy dist/prototype.js to a suitable location. Then include it in your HTML like so:

    <script type="text/javascript" src="/path/to/prototype.js"></script>
    

     

    Documentation http://api.prototypejs.org/

    http://prototypejs.org/learn/

    Tutorials

    This area contains narrative documentation you can use to discover Prototype.

     

    转载于:https://www.cnblogs.com/chucklu/p/11100977.html

    展开全文
  • 很早就知道prototype.js是一个javascript的工具函数库,平时的开发中使用频率也非常的高,但是,由于工作时间问题,一直都没有静下心来研究学习一下,最近又萌发了系统学习prototype.js的念头,刚好手头比较闲,就...

     很早就知道prototype.js是一个javascript的工具函数库,平时的开发中使用频率也非常的高,但是,由于工作时间问题,一直都没有静下心来研究学习一下,最近又萌发了系统学习prototype.js的念头,刚好手头比较闲,就决定边学习边将学习心得记录下来,以和更多的同仁交流分享。

    关于prototype.js

    如果你曾经使用过prototype.js,那么,本系列文章希望能够给你提供一个使用指南,可以作为prototype.js中函数的参考文档。

    如果你还是第一次听到prototype.js这个词,那么,你需要进一步读一下下面这些文字了,以便你能更好的了解它到底是个什么东西,现在,我只能告诉你,对于致力于web系统开发的你来说,它的确是个好东西!

    从名字上就能看出来,prototype.js是个js文件,对,它的确是个js文件,是个拥有四千多行代码的文件,对于javascript的初学着来说,要读懂它,太难了,就像普通百姓很难了解电视机的原理一样,但是,不了解电视机的原理并不意味着俺们这些小百姓不会使用电视,同样的,尽管现在我们不愿意将时间花费在阅读这四千多行的源代码上,但这并不影响我们拿来使用,本系列文章不想过多地分析源代码,只想将这四千多行的源代码中所包含的功能函数向各位同仁描述清楚,让大家知道如何来用就是了,当然,这个愿望能否实现,还得再看,如果FuWaer哪天懒得不想动笔了,那可能这个系列文章也可能就夭折了,我尽力吧:)

    说了这么多的废话,现在开始说prototype.js吧,如果你想先看看它长什么样子,你可以先把它下载下来,下载地址为:http://prototypejs.org/assets/2007/6/20/prototype.js,这个文件并不大,只有120k,如果你确实想了解它的神奇之处,你还是把它下载下来吧。

    prototype.js的作者是Sam Stephenson,对,是个老外,我不崇洋媚外,但我的确欣赏老外在技术领域的专注和细致,这里向他老人家致敬了。

     

    系列文章列表(动态更新中)

    prototype.js的系列文章——$()函数

    prototype.js的系列文章——$F()函数

     

    展开全文
  • prototype.js 和json.js 冲突

    千次阅读 2013-11-13 11:01:43
    prototype.js与json.js并不是完全兼容的。主要冲突在于json.js为Object的原型增加了一个toJSONString的方法。 冲突之一:是prototype中发送ajax请求时,遍历了一个header Object,结果将toJSONString也误当作一个...

    1.冲突简述和分析
    prototype.js与json.js并不是完全兼容的。主要冲突在于json.js为Object的原型增加了一个toJSONString的方法。
    冲突之一:是prototype中发送ajax请求时,遍历了一个header Object,结果将toJSONString也误当作一个header属性发送,导致错误:
    [Exception... "Component returned failure code: 0x80070057 (NS_ERROR_ILLEGAL_VALUE) [nsIXMLHttpRequest.setRequestHeader]" nsresult: "0x80070057 (NS_ERROR_ILLEGAL_VALUE)" location: "JS frame :: http://astlogo.com/cstmface/js/lib/prototype.js :: anonymous :: line 1289" data: no]

    如果您没有将ajax请求异常捕获,遇到这个冲突的时候会很诡异。即没有js错误提示,也没有发送请求。如果遇到这样的情况,请在Ajax.Request请求的选项中多加一个事件监听:
    function x_load_testdata(id) {
        new Ajax.Request('testdata.php',
        {
            method:'get',
            onSuccess: function(transport){
            },
            onFailure: function(){ alert('Request failure') },
            onException: function(x, e) { alert(e) }
        });
    }
    确认一下是否因为这个冲突导致。
    冲突之二
    :反过来,如果将prototype使用的所有Object都增加一个toJSONString方法,也会出现问题。由于prototype的继承关系比较复杂,有些对象因此会继承多个toJSONString方法,调用的时候就会出错。

    2.解决冲突的方案
    首先,请先加载prototype.js,后加载json.js,这样就可以避免出现“冲突之二”。
    <script type="text/javascript" src="js/lib/prototype.js"></script>
    <script type="text/javascript" src="js/lib/json.js"></script>
    其次,要解决prototype的Ajax.Request异常,就需要修改prototype.js的代码了(就我自己来说很不想改,不过如果您的项目也是必须同时依赖这两个JS,请也按照下面步骤修改):
    在prototype.js中找到:(大概位于第1283行和1284行)
        for (var name in headers)
          this.transport.setRequestHeader(name, headers[name]);
    修改为:
        for (var name in headers) {
            if (!Object.isFunction(headers[name])) {
                  this.transport.setRequestHeader(name, headers[name]);
            }
        }
    就是用Object.isFunction方法确定遍历到的header的属性不是一个函数(过滤掉toJSONString这个属性),“冲突之一”也就解决了。
    注:我使用的js版本:prototype.js 1.6.0.3 、 http://www.json.org/json.js (2007-03-06)
    写到这里,其实prototype.js里面也有json to string的方法(Object.toJSON):
    var data = {error:'', data:''};
    var json = Object.toJSON(data);
    alert(json);
    如果不是必须使用这两个js,建议您只使用prototype.js

    展开全文
  • js prototype

    万次阅读 2008-07-15 11:53:00
    我们知道JScript中对象的prototype属性,是用来返回对象类型原型的引用的。我们使用prototype属性提供对象的类的一组基本功能。并且对象的新实例会"继承"赋予该对象原型的操作。但是这个prototype到底是怎么实现和被...
    我们知道JScript中对象的prototype属性,是用来返回对象类型原型的引用的。我们使用prototype属性提供对象的类的一组基本功能。并且对象的新实例会"继承"赋予该对象原型的操作。但是这个prototype到底是怎么实现和被管理的呢? 

    对于对象的prototype属性的说明,JScript手册上如是说:所有 JScript 内部对象都有只读的 prototype 属性。可以向其原型中动态添加功能(属性和方法),但该对象不能被赋予不同的原型。然而,用户定义的对象可以被赋给新的原型。

    下面我们看三个经典的prototype属性的使用示例。

    1
    、为脚本环境内建对象添加方法:


    程序代码
    Array.prototype.max = function()
    {
    var i, max = this[0];
    for (i = 1; i < this.length; i++)
    {
    if (max < this[i])
    max = this[i];
    }
    return max;
    };


    2
    、为用户自定义类添加方法:

    程序代码
    function TestObject(name)
    {
    this.m_Name = name;
    }

    TestObject.prototype.ShowName = function()
    {
    alert(this.m_Name);
    };

    3
    、更新自定义类的prototype


    程序代码
    function TestObjectA()
    {
    this.MethodA = function()
    {
    alert(&apos;TestObjectA.MethodA()&apos;);
    }
    }

    function TestObjectB()
    {
    this.MethodB = function()
    {
    alert(&apos;TestObjectB.MethodB()&apos;);
    }
    }

    TestObjectB.prototype = new TestObjectA();


    第三个很眼熟吧?对啊,它就是我们前面介绍的原型继承法呀~~ 不过今天我们不是研究"继承",之所以可以这样来实现一种继承,只是利用了prototype属性的一个副作用而已。

    prototype
    还有一个默认的属性:constructor,是用来表示创建对象的函数的(即我们OOP里说的构造函数)constructor属性是所有具有prototype属性的对象的成员。它们包括除GlobalMath对象以外的所有JScript内部对象。constructor属性保存了对构造特定对象实例的函数的引用。

    弄清楚了JScriptprototype属性怎么使用后,下面我们再来深入的研究它。
    上面的文章中我罗列了一下prototype属性在JScript中的各种用法,但是prototype这个东西却不是JScript创造出来的,JScript实际上是使用了我们设计模式中prototype pattern的一种衍生形式。下面我先简单的说一下prototype pattern,然后再来看到底JScript中的prototype是怎么回事?!

    What&apos;s prototype pattern?

    Specify the kinds of objects to create using a prototypical instance, and create new objects by copying this prototype.

    用原型实例指定创建对象的种类,并且通过拷贝这些原型创建新的对象。

    原型模式允许一个对象再创建另外一个可定制的对象,根本无需知道任何如何创建的细节,工作原理是:通过将一个原型对象传给那个要发动创建的对象,这个要发动创建的对象通过请求原型对象拷贝它们自己来实施创建。

    继续了解到底什么是prototype pattern,可以参看&apos;设计模式之Prototype(原型)&apos;这篇文章,即使不懂Java也没有关系,把它的代码都当C#看就行了。

    搞清楚什么是原型了吧?反正记着一点,prototype pattern是的实现是依赖于clone这个操作的,当然要shallow copy还是deep copyclone看自己的需要了。

    下面我们继续说JScript里的prototype,为什么我们说它和prototype pattern里的prototype不一样呢?! 这个不是我说就说出来的,也不是我吹出来的,看看这个示例,你就能大概糊涂:

    程序代码
    <script language="javascript">
    function RP()
    {
    RP.PropertyA = 1;
    RP.MethodA = function()
    {
    alert("RP.MethodA ");
    };

    this.PropertyA = 100;
    this.MethodA = function()
    {
    alert("this.MethodA");
    };
    }

    RP.prototype.PropertyA = 10;
    RP.prototype.MethodA = function()
    {
    alert("RP.prototype.MethodA");
    };
    </script>

    不要着急,还没有开始做示例,只是给出了我们用来演示的一个类。RP是什么?rpwt吗?当然不是了,RPResearchPrototype了。好了不废话了,看示例及结果分析。


    程序代码
    <script language="javascript">
    rp = new RP();
    alert(RP.PropertyA);
    RP.MethodA();
    alert(rp.PropertyA);
    rp.MethodA();
    </script>


    运行结果闪亮登场:
    1
    RP.MethodA
    100
    this.MethodA
    这个%$@#^$%&^...,不要着急,继续看哦!


    程序代码
    <script language="javascript">
    rp = new RP();
    delete RP.PropertyA;
    alert(RP.PropertyA);
    delete RP.MethodA;
    RP.MethodA();
    delete rp.PropertyA;
    alert(rp.PropertyA);
    delete rp.MethodA;
    rp.MethodA();
    </script>
    运行结果再次登场:

    程序代码
    undefined
    A Runtime Error has occurred.
    Do you wish to Debug?
    Line: 32
    Error: Object doesn&apos;t support this property or method
    10
    RP.prototype.MethodA


    好玩吧,看出来什么名堂了吗?这里的RP.PropertyARP.MethodA只是用来做参照的,可是怎么把this.PropertyAthis.MethodAdelete了,还能出来结果,而且还是prototype导入的属性和方法呢?

    这就是JScriptprototypeprototype patternprototype最大的不同了,JScript中的这个所谓的prototype属性其实是个语言本身支持的特性,这里没有发生任何的copy,不管shallow还是deep的。对于JScript的解释引擎,它在处理".""[keyName]"引用的对象的属性和方法时,先在对象本身的实例(this)中查找,如果找到就返回或执行。如果没有查找到,就查找对象的prototype(this.constructor.prototype)里是否定义了被查找的对象和方法,如果找到就返回或执行,如果没有查找到,就返回undefined(对于属性)runtime error(对于方法)

    正因为prototype导入类实例的属性或方法是动态查找的,所以我们才能对系统内部对象添加prototype属性和方法,比如给String对象添加trim方法:


    程序代码
    <script lanuage="javascript">
    String.prototype.trim()
    {
    return this.replace(/(^/s+)|(/s+$)/g, "");
    }
    </scritp>

    显然JScript中的这种用法也是prototype pattern中的prototype不能解释和支持的。

    这下对于JScript OOP中原型继承法的理解因该没有任何的障碍了吧?同时也应该明白为什么原型继承法有那么大的天生缺陷了吧?当然如果有任何问题,欢迎继续讨论。

    附演示示例源代码:


    程序代码
    <html>
    <head>
    <meta name="author" content="birdshome@
    博客园">
    <title>JScript Prototype Research</title>
    </head>
    <body>
    <script language="javascript">
    function RP()
    {
    RP.PropertyA = 1;
    RP.MethodA = function()
    {
    alert("RP.MethodA ");
    };

    this.PropertyA = 100;
    this.MethodA = function()
    {
    alert("this.MethodA");
    };
    }

    RP.prototype.PropertyA = 10;
    RP.prototype.MethodA = function()
    {
    alert("RP.prototype.MethodA");
    };
    </script>
    <script language="javascript">
    rp = new RP();
    delete RP.PropertyA;
    alert(RP.PropertyA);
    delete RP.MethodA;
    RP.MethodA();
    delete rp.PropertyA;
    alert(rp.PropertyA);
    delete rp.MethodA;
    rp.MethodA();
    </script>
    </body>
    </html>
    展开全文
  • JS prototype

    2016-11-15 13:39:26
    prototype,每一个函数对象都有一个显示的prototype属性,它代表了对象的原型(Function.prototype函数对象是个例外,没有prototype属性)。 作用:给对象添加对象属性和方法(通过new对象使用);可以用于继承; js的...
  • prototype.js

    2011-12-16 09:39:33
    prototype.js是一个非常优雅的javascript基础类库,对javascript做了大量的扩展,而且...官方网站:http://www.prototypejs.org/ 中文API参考:https://compdoc2cn.dev.java.net/prototype/html/prototype.js.cn.html
  • prototype.js jquery.js

    2010-08-06 11:20:00
    prototype.js是对原生对象的功能增强,多是扩充原生对象。 jquery.js是对原生语句的封装,多是构建自己的对象。
  • 之前的2篇文章在讨论prototypejs库的继承实现方式、$super和_super过程中,我看到了Function#wrap()这个很有意思的API。这篇文章学习下如何使用Function#wrap(),以及它的源码。我们先看下官方对这个API的说明:也...
  • prototype 源码解读 之 prototype.js

    千次阅读 2005-08-14 17:33:00
    时间: 2005-7-16 周六, 上午12:34 标题: prototype 源码解读 之 prototype.js 醒来>http://prototype.conio.net/ 我喜欢Javascript,热衷于 Ajax 应用。我把自己阅读prototype源码的体会写下来,希望对大家重新认识...
  • Js中的prototype

    2016-07-23 22:50:45
    最近新入职了一家公司,周五看代码的时候,发现... javascript中的每个对象都有prototype属性,js中对象的prototype属性的解释是,返回对象类型原型的引用。 A.prototype=new B(); 理解prototype不应把它和继承混淆
  • JS中的prototype

    千次阅读 2014-08-08 18:27:10
    JS中的phototype是JS中比较难理解的一个部分   本文基于下面几个知识点:   1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个类B,这个类...
  • prototype.js教程及prototype中文手册

    千次阅读 2018-06-28 17:08:50
    http://topmanopensource.iteye.com/blog/382425收集了网上的prototype.js教程及prototype中文手册,方便大家使用prototype.js 1.4中文教程doc格式http://www.dayanmei.com/upload/prototype1.4.docprototype.js 1.4...
  • 使用prototype.js的事件处理方法

    千次阅读 2007-08-12 23:40:00
    prototype.js中包含了Event对象,其中提供了几个常用的方法,来帮助开发者完成事件处理。比较常用的方法有: Event.element(event):获得当前事件发生的对象; Event.isLeftClick(event):判断按下的是否为鼠标...
  • js prototype 详解 prototype只能用在类型上。 以下是一些关于类型和对象的例子,大家看完例子后可能更容易理解类型和对象之间的联系: 1、可以在类型上使用proptotype来为类型添加行为。这些行为只能在...
  • prototype.js教程

    2010-01-16 13:33:18
    收集了网上的prototype.js教程及prototype中文手册,方便大家使用 prototype.js 1.4中文教程doc格式 http://www.dayanmei.com/upload/prototype1.4.doc prototype.js 1.4中文教程以及prototype 1.5英文教程以及...
  • prototype.js 指南

    2008-01-27 13:00:00
    Prototype Tips and Tutorials in url:http://particletree.com/features/quick-guide-to-prototype
  • prototype.js介绍

    2007-04-20 17:59:00
    1.prototype.js是一个由Sam Stephenson写的javaScript包。2.$()方法是DOM中使用过于频繁的document.getElementById()方法的一个便利的简写,就像这个方法一样,这个方法返回参数传入的id的那个元素。3.$F()方法是另...
  • prototype.js 实践

    千次阅读 2006-01-01 12:07:00
    后来从 fayland 的共享连接中看到了 prototype.js 的非官方版本的中文翻译,大致看了下,才知道自己错过了很多东西。于是打印出来,在回家的路上通读了一遍,小有收获。起码我知道可以用 $() 和 $F() 这两个简单的...
  • 实在太可恶,在csdn.net 想要prototype中文手册,结果被骗了八分。什么都没有。唉。...收集了网上的prototype.js教程及prototype中文手册,方便大家使用 prototype.js 1.4中文教程doc格式 http:/...

空空如也

1 2 3 4 5 ... 20
收藏数 69,743
精华内容 27,897
关键字:

prototype