１，
Prototype.js是什么?
prototype.js 是一个由 Sam Stephenson大仙 编写的 JavaScript 程序包。这个程序包使程序员可以轻松的创建良好兼容性和交互性的web应用程序，并可以很容易的加入Web 2.0特性。
要学习他，首先要下载这个包 prototype.js 。(只有从官方网站上下载的程序包才能保证其纯洁，很多人修改了 prototype.js 的代码添加自定义的特性)
２， 通用方法的学习
$()= document.getElementById()
例子：
<html>
<head><title>prototype.js学习--http://blog.csdn.net/precipitant</title>
<scriptsrc="ProtoType.js"type="text/javascript"></script>
<scriptlanguage="javascript"type="text/javascript">...
functionstudy()
...{
vardiv=$('div3');
alert(div.innerHTML);
vardivs=$('div1','div2');
for(i=0;i<divs.length;i++)
...{
alert(divs[i].innerHTML);
}
}
</script>
</head>
<body>
<inputtype="button"name="b1"value="确定"onclick="study()"/>
<divid="div1">
NorthsnowisstudingPrototype.js1.51
</div>
<divid="div2">
塞北的雪正在研究prototype.js1.51
</div>
<divid="div3">
塞北的雪：http://blog.csdn.net/precipitant
</div>
</body>
</html>
$F() 返回控件的值（value）
例子：
<html>
<head><title>prototype.js学习--http://blog.csdn.net/precipitant</title>
<scriptsrc="ProtoType.js"type="text/javascript"></script>
<scriptlanguage="javascript"type="text/javascript">...
functionstudy()
...{
varval=$F('txt1','b1');
alert(val);
}
</script>
</head>
<body>
<inputtype="button"name="b1"value="确定"onclick="study()"/>
<inputtype="text"name="txt1"value="塞北的雪：http://blog.csdn.net/precipitant"/>
</body>
</html>
$A() 转换列表数据为Array
例子：
<html>
<head><title>prototype.js学习--http://blog.csdn.net/precipitant</title>
<scriptsrc="ProtoType.js"type="text/javascript"></script>
<scriptlanguage="javascript"type="text/javascript">...
functionstudy()
...{
varoList=$('select1').getElementsByTagName('option');
varnodes=$A(oList);
varnode;
for(vari=0;i<nodes.length;i++)
...{
node=nodes[i];
alert(node.nodeName+'['+node.value+':'+node.innerHTML+']');
}
nodes.each(function(node)...{
alert(node.nodeName+'['+node.value+':'+node.innerHTML+']');
});
}
</script>
</head>
<body>
<inputtype="button"name="b1"value="确定"onclick="study()"/>
<selectid="select1"size="10">
<optionvalue="A">NorthsnowisstudingPrototype.js1.51</option>
<optionvalue="B">塞北的雪正在研究prototype.js1.51</option>
<optionvalue="C">塞北的雪：http://blog.csdn.net/precipitant</option>
</select>
</body>
</html>
$H() 对象转化成可枚举的貌似联合数组Hash对象
转成 Hash要求对象的属性值必须为数字
<html>
<head><title>prototype.js学习--http://blog.csdn.net/precipitant</title>
<scriptsrc="ProtoType.js"type="text/javascript"></script>
<scriptlanguage="javascript"type="text/javascript">...
functionstudy()
...{varenum1=newObject();
enum1=...{
Northsnow:1,
CSDN:2,
NetLover:3
};
enum1['Microsoft']=4;
enum1['ProtoType']=5;
varhash=$H(enum1);
varenum2=...{
JS:6,
Html:7
}
hash=hash.merge(enum2);
alert(hash.inspect());
alert(hash.toQueryString());
}
</script>
</head>
<body>
<inputtype="button"name="b1"value="确定"onclick="study()"/>
</body>
</html>
$R() 是 new ObjectRange(lowerBound, upperBound, excludeBounds)的简化版。
例子：
<html>
<head><title>prototype.js学习--http://blog.csdn.net/precipitant</title>
<scriptsrc="ProtoType.js"type="text/javascript"></script>
<scriptlanguage="javascript"type="text/javascript">...
functionstudy()
...{
varrange=$R(1,5,false);
range.each(function(value,index)...{
alert(value);
});
alert(range.include(5));
varrange=$R(1,5,true);
range.each(function(value,index)...{
alert(value);
});
alert(range.include(5));
varrange=$R('a','b');
range.each(function(value,index)...{
alert(value);
});
}
</script>
</head>
<body>
<inputtype="button"name="b1"value="确定"onclick="study()"/>
</body>
</html>
分享到：
相关推荐
prototype.js 是一个由Sam Stephenson写的JavaScript包。这个构思奇妙编写良好的一段兼容标准的一段代码将承担创造胖客户端， 高交互性WEB应用程序的重担。轻松加入Web 2.0特性。 如果你最近体验了这个程序包，你很...
或许你还没有用过它， prototype.js 是一个由Sam Stephenson写的JavaScript包。这个构思奇妙编写良好的一段兼容标准的一段代码将承担创造胖客户端， 高交互性WEB应用程序的重担。轻松加入Web 2.0特性。 <br...
prototype.js是一个非常优雅的javascript基础类库，对javascript做了大量的扩展，而且很好的支持Ajax，国外有多个基于此类库实现的效果库，也做得很棒。 prototype.js不仅是一个有很大实用价值的js库，而且有很高的...
万一你没有使用过大名鼎鼎的prototype.js，那么让我来告诉你，prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙，而且兼容标准的类库，能帮助你轻松建立有高度互动的web2.0特性的富客户端页面。...
prototype.js参考 9 4.1. JavaScript 类的扩展 9 4.2. 对 Object 类的扩展 9 4.3. 对 Number 类的扩展 9 4.4. 对 Function 类的扩展 9 4.5. 对 String 类的扩展 10 4.6. 对 document DOM 对象的...
Prototype学习笔记（一）（二）的源代码
10) 每个类都有一个原型（prototype）对象，它具有一套属性和方法，用来共享一个类的方法和常量，还有一个constructor的属性引用构造函数。 11) JavaScript中面向对象的特性： a) 实例属性：在构造函数创建或初始化...
ES下一个学习笔记 数字 大批 目的 功能 班级 象征 放 地图 正则表达式 代理人 反映 承诺 发电机 迭代器 模块 ES2016（ES7） Array.prototype.includes（） 求幂运算符 ES2017（ES8） 细绳 目的 异步等待 尾随...
好，那就让我们一步步打造，首先让我们来看下继承原本的写法： 代码如下: [removed] var Person = function(name, age) { this.name = name; this.age = age; } Person.prototype.SayHello = function () { alert&#...
最近学习vue项目，遇见elementui导出数据为xlsx、excel表格，今天就介绍给大家，也给自己留个笔记，方便查询 我这里为了同学们好理解，把所有元素都写到一个页面。 1.第一步安装插件 npm install file-saver ...
而原型正是实现javascript继承的很重要的一种方法！ 我们首先来看以下代码： 代码如下: function person(name, age) { this.name = name; this.age = age; } person.prototype.getInfo = function() { alert(...
// Poisoning Object.prototype Object.prototype.bar = 1; var foo = {goo: undefined}; foo.bar;...Javascript 中没有其他方法能判断一个属性是定义在对象本身还是继承自原型链。 hasOwnProperty 作为
基础篇 Javascript学习笔记1 数据类型 Javascript学习笔记2 函数 Javascript学习笔记3 作用域 Javascript学习笔记4 Eval函数 Javascript学习笔记5 类和对象 Javascript学习笔记6 prototype的提出 Javascript学习...
Javascript 中的构造函数与其他语言相比也是不同的。任何通过关键字 new 调用的函数都可以当做构造函数。 在构造函数体内，this 指向新创建的对象。如果构造函数体内没有显示的 return 表达式，那么我们就默认返回 ...
主要介绍了vue学习笔记之动态组件和v-once指令,结合简单实例形式详细分析了vue.js动态组建点击切换相关操作技巧,需要的朋友可以参考下
一、判断 语法 prop in objectName 如果objectName指向的对象中含有prop这个属性或者键值，in运算符会返回true。 代码如下: var arr = [‘one’,’two’,’three’,’four’]; arr.five = ‘5’; 0 in arr;//true ...
} SuperClass.prototype.getSuperValue = function() { return this.property; } //定义SubClass类，有一个属性subproperty和后来添加的一个方法getSubValue function SubClass() { this.subproperty = fals