1.Insertion
<script src="prototype.js"></script>
<div id="div1" style="font-size:20px;font-weight:bold">
<hr>基线<hr>
</div>
<script>
new Insertion.After("div1", " After");
new Insertion.Bottom("div1", " Bottom");
new Insertion.Top("div1", " Top");
new Insertion.Before("div1", " Before");
</script>
2. Even Observe
<script src="prototype.js"></script>
<input type="button" id="btn" value="click" />
<input type="button" id="reg" value="register" />
<input type="button" id="unreg" value="unregister" />
<div id="status"></div>
<script>
function test() {
alert("clicked");
}
Event.observe("reg", "click", function () {
Event.observe("btn", "click", test, false);
$("status").innerHTML = "event registered";
}, false
);
Event.observe("unreg", "click", function () {
Event.stopObserving("btn", "click", test, false);
$("status").innerHTML = "event unregistered";
}, false
);
</script>
3. Form.Element.Observer
<script src="prototype.js"></script>
<form id="frm">
<div id="div1">
<input type="text" id="txt" name="txt" onchange="return alert('Now')"/>
<input type="text" id="txt2" name="txt2" />
<input type="button" id="btn" name="btn"
value="click" onclick="test(event)" />
<input type="submit" />
<a href="http://www.google.com" onclick="test2(event)">Google</a>
<input type="button" id="btn1" name="btn1"
value="click" onclick="test3(event)" />
</div>
</form>
<script>
function test(evt) {
alert($("btn") === Event.element(evt));
}
function test2(evt) {
alert("clicked");
Event.stop(evt);
}
function test3(evt) {
alert($("div1") === Event.findElement(evt, "div"))
}
new Form.EventObserver("frm", function () {
alert("form changed");
}
);
new Form.Element.EventObserver("txt", function () {
alert("txt changed");
}
);
new Form.Observer("frm", 1, function () {
alert("form changed");
}
);
new Form.Element.Observer("txt", 1, function () {
alert("changed");
}
);
</script>
4. Hash
<script src="prototype.js"></script>
<script>
// 创建一个对象
var obj = {
key1: 1,
key2: 2,
key3: 3
};
// 将其转换为Hash对象
var hash = $H(obj);
// 输出 #<Hash: {'key1': 1, 'key2' : 2, 'key3': 3}>
// 输出key1=1&key2=2&key3=3
alert("hash.inspect()"+hash.inspect()+"\r\ntoQueryString: "+hash.toQueryString()+"\r\n"+"values: "+hash.values()+"\r\n keys: "+hash.keys());
</script>
5.ObjectRange
<script src="prototype.js"></script>
<div id="div1" style="font-size:20px;font-weight:bold">
ObjectRange
</div>
<script>
var range = $R(1, 10, false);
var range2 = $R(1, 10, true);
alert(range.merge(range2));
// true
alert(range.include(1));
// true
alert(range.include(5));
// true
alert(range.include(10));
// true
alert(range2.include(1));
// true
alert(range2.include(5));
// false
alert(range2.include(10));
</script>
6 . String
<html>
<head>
<title>String Test</title>
<script src="prototype.js"></script>
<script>
function testStrip()
{
var str=new String(' wanfangdata ');
alert(str.strip());
}
function teststripTags()
{
var str=new String('<html>2002<head>2005<body> ');
alert(str.stripTags());
}
function testtruncate()
{
var str=new String('king123456789987654321');
alert(str.truncate(8,'*'));
}
function testcamelize()
{
var str=new String('Background-color')
alert(str.camelize())
}
function testcapitalize()
{
var str=new String('back');
alert(str.capitalize());
}
function testDasherize()
{
var str=new String('Hello_World');
alert(str.dasherize());
}
function testinspect()
{
alert("sdfj\"sfa".inspect() );
}
function testgsub()
{
alert("skdjfAsfdjkAdk".gsub(/A/,function(match) {return match[0].toLowerCase()}));
}
function testScan()
{
alert("skdjfAsfdjkAdk".scan(/A/,function(){alert('have a A')}));
}
function testUnderscore()
{alert('borderBottomWidth'.underscore());
}
function testTemplate()
{var temp = new Template("被替换");
alert(temp.evaluate('aAklkljkjAkka'));
}
function testTimes()
{
alert('['+'Q'.times(10)+']');
}
function testEval()
{
var str="<script"+">alert('ok');<"+"/script>";
str.evalScripts();
}
</script>
<body>
<p><input type=button value='Strip' onclick='testStrip();' />" wanfangdata " ---> 'wanfangdata'去掉两边的空格</p><br/>
<p><input type=button value='stripTags' onclick='teststripTags();' />“<html>2002<head>2005<body>” ---> '20022005'去掉html标签</p><br/>
<p><input type=button value='truncate' onclick='testtruncate();' />“123456789>987654321” ---> '123456>'字符串截断</p><br/>
<p><input type=button value='camelize' onclick='testcamelize();' />Background-color --->BackgroundColor</p><br/>
<p><input type=button value='capitalize' onclick='testcapitalize();' />back--->Back</p><br/>
<p><input type=button value='inspect' onclick='testinspect();' />sdfj\"sfa--->sdfj"sfa</p><br/>
<p><input type=button value='testgsub' onclick='testgsub();' />skdjfAsfdjkAdk--->skdjfasfdjkadk</p><br/>
<p><input type=button value='testScan' onclick='testScan();' />字符串检测</p><br/>
<p><input type=button value='testTemplate()' onclick='testTemplate();' />字符串模板</p><br/>
<p><input type=button value='testTimes' onclick='testTimes();' />字符串重复</p><br/>
<p><input type=button value='执行脚本' onclick='return testEval();' />执行字符串脚本</p><br/>
<p><input type=button value='testUnderscore' onclick='testUnderscore();' />'borderBottomWidth’.underscore() -> 'border_bottom_width’
</p><br/>
<p><input type=button value='testDasherize' onclick='testDasherize();' />'Hello_World' ---> 'Hello-World'把下划线转化成-</p><br/>
</body>
</html>
<转自:http://www.cnblogs.com/me-sa/archive/2007/04/24/724660.html >
分享到:
相关推荐
在本篇"prototype笔记(9)----结合Prototype和JSON开发AJAX"中,我们将深入探讨如何利用Prototype JavaScript库与JSON(JavaScript Object Notation)技术来高效地开发异步JavaScript应用程序,也就是我们常说的AJAX...
Prototype学习笔记(一)(二)涵盖了这一主题的深入探讨,旨在帮助开发者更好地理解和利用这个特性。在本篇文章中,我们将详细阐述Prototype的核心概念、作用以及如何在实际编程中应用。 首先,Prototype是...
Prototype 是一个广泛使用的JavaScript库,由Sam Stephenson创建,旨在简化和增强JavaScript的原生功能,特别是对于构建富客户端Web应用程序。它通过提供强大的对象扩展、DOM操作、以及Ajax交互等工具,使得开发者...
《Prototype开发笔记》是关于JavaScript框架Prototype的一份详细文档,主要涵盖了该框架的基本概念、核心功能和使用方法。Prototype是一个由Sam Stephenson编写的JavaScript库,它的设计目标是提升Web应用的交互性和...
这篇"prototype学习笔记"可能探讨了如何利用原型链实现面向对象编程的关键技术。以下是对这个主题的详细解析。 首先,理解`prototype`的基本含义是关键。在JavaScript中,每个函数都有一个`prototype`属性,这个...
本笔记将深入探讨`Prototype`机制及其在实际开发中的应用。首先,我们从基本概念出发,理解`Prototype`的核心原理。 `Prototype`是JavaScript中每个对象所固有的特性,它为对象提供了继承的能力。在JavaScript中,...
### Prototype.js 开发笔记知识点详解 #### 1.1 Prototype.js 是什么? Prototype.js 是一个由 Sam Stephenson 开发的 JavaScript 库。该库的主要目的是简化 Web 应用程序的开发过程,尤其针对那些需要高度交互性...
《Prototype开发应用手册:深入解析与实践》 Prototype是一个强大的JavaScript库,由Sam Stephenson创建,旨在提升JavaScript的开发效率,提供丰富的类和函数扩展,为JavaScript编程带来面向对象的特性。在本手册中...
万一你没有使用过大名鼎鼎的prototype.js,那么让我来告诉你,prototype.js是由Sam Stephenson写的一个javascript类库。这个构思奇妙,而且兼容标准的类库,能帮助你轻松建立有高度互动的web2.0特性的富客户端页面。...
### Prototype学习笔记(最新整理) #### 1. Prototype是什么? Prototype是一个由Sam Stephenson编写的JavaScript库,旨在简化客户端脚本编程,使开发者能够轻松创建动态的、交互式的Web应用程序。该库通过提供一...
【Prototype开发笔记】 在JavaScript的世界里,Prototype是一个非常重要的库,它由Sam Stephenson编写,为Web应用程序提供了丰富的功能和工具。Prototype的核心理念是通过增强JavaScript的原生对象和引入面向对象的...
【标题】:Prototype.js开发笔记 【描述】:本文档主要涵盖了Prototype.js库的编程指南,包括其核心概念、通用方法、Ajax对象以及对JavaScript原生类型和DOM对象的扩展。Prototype.js是一个由Sam Stephenson编写的...
Prototype.js开发笔记 Prototype.js是一个JavaScript库,由Sam Stephenson编写,用于简化JavaScript编程,提供了许多有用的函数和方法,以帮助开发者快速构建Web应用程序。下面是Prototype.js的开发笔记,涵盖了该...
3. **方法重写**: - 在 `benbenxiong` 实例中,我们重写了 `SayHello` 方法。这意味着对于 `benbenxiong` 实例来说,将调用这个新的方法,而不是原型上的方法。 4. **构造函数调用**: - 使用 `call` 方法调用...