ajax入门指南(五)

ajax学习入门指南,对ajax初学者应该有所帮助。

Prototype基础类:
       1. Class.create()
            示例:
                var myClass = Class.create();

      2.  Object.extend(destination,source)
            示例:
                var myClass = Class.create();
                myClass.prototype = {
                initialize: function() {
                 },
                 f1: function() {
                      alert("do f1()");
                 },
                 f2: function() {
                      alert("do f2()");
                 },
                 toString: function() {
                      return "myClass";
                 }
            };
            var mySubClass = Class.create();
            Object.extend(mySubClass.prototype, myClass.prototype);

       3. Object.inspect(object)
            返回目标对象的文字说明,如果对象没有定义inspect方法,则默认返回object.toString()的值
            示例:
            var myClass = Class.create();
            myClass.prototype = {
                 initialize: function() {
                 },
                 toString: function() {
                  return "myClass";
                 }
            };
            var obj = new myClass();
            alert(Object.inspect(obj));
        4.Function.prototype.bind(object)
            返回一个Function的实例,其结构与当前的Function对象完全相同,只是作用域已经转移到参数指定的object对象上
            示例:
            var myClass = Class.create();
            myClass.prototype = {
                 initialize: function() {
                 },
                 name: "myClass",
                 f1: function() {
                     alert(this.name + " from f1");
       }
            };
            var myClass2 = Class.create();
            myClass2.prototype = {
                 initialize: function() {
                 },
                 name: "myClass2",
                 f2: function() {
                      alert(this.name + " from f2");
                 }
            };
            var obj = new myClass();
            var obj2 = new myClass2();

            obj2.f2 = obj.f1.bind(obj2);
            obj2.f2(); // 输出"myClass2 from f1"

        5.Function.prototype.bindAsEventListener
            与bind方法的功能相同,只不过bingAsEvevntListener用于绑定事件.
            示例:
            var Watcher = Class.create();
            Watcher.prototype = {
                     initialize: function(buttonid, message) {
                              this.button = $(buttonid);
                              this.message = message;
                              // 将button的onclick和this对象的showMessage方法绑定起来
                              this.button.onclick =
                               this.showMessage.bindAsEventListener(this);
                     },
                     showMessage: function() {
                          alert(this.message);
                     }
                };
            var watcher = new Watcher('btn', 'clicked');

        6.PeriodicalExecuter类
            创建PeriodicalExecuter类的实例将会周期性地调用指定的方法
            function setTime() {
                 $('divTime').innerHTML = (new Date()).toLocaleString();
            }
            new PeriodicalExecuter(setTime, 1);
            第一个参数:调用的方法;第二个参数:间隔多少秒
字符串处理(String对象扩展)
           1.String .prototype.gsub(pattern,replacement)
                将字符串中所有正则表达式匹配的部分替换成指定的字符串
                pattern:正则表达式
                replacement:用作替换的字符串
                示例:
                var str = "this is a test test";
                //输出"this is a new new"
                alert(str.gsub(/test/,"new"));
               
            2.String.prototype.truncate(length,truncation)
                将字符串截断
                length:截断后字符串的长度,默认值为30
                trancation:截断字符串时,替代尾部的字符串,默认是"..."
                示例:
                 var str = "this is a test test";
                //输出"this is ..."
                  alert(str.truncate(10));
                //输出"this is a t..."
                alert(str.truncate(14));
                //输出"this is***"
                alert(str.truncate(10,"***"));

            3.String.prototype.strip()
                删除字符串前后的空白字符
                示例:
                var str="this is a test test  ";
                alert(str.strip().length);//19
                alert(str.length);//21

            4.String.prototype.stripTags()
                移除字符串中所有的HTML和XML标签
                示例:
                var str = "<table><tr><td>stripTagsDemo</td></tr></table>";
               alert(str.stripTags());//输出"stripTagsDemo"

            5.String.prototype.stripScripts()
                移除字符串所有的<script></script>脚本标记内容
                示例:
                var str = "this is a test<script>alert('ok')<"+"/script>";
               alert(str.stripScripts());//输出"this is a test"
6.String.prototype.evalScripts()
                执行在字符串中找到的所有脚本
                var str = "this is a test<script>alert('ok')<"+"/script>";
               str.evalScripts();//输出"ok"

            7.String.prototype.escapeHTML()
                将字符串中的所有HTML标记进行转义
                示例:
                var str = "<table><tr><td>stripTagsDemo</td></tr></table>";
               alert(str.escapeHTML());

            8.String.prototype.unescapeHTML()
                执行与escapeHTML()相反的操作

            9.String.prototype.toQueryParams()
                将查询字符串转化为一个联合数组
                示例:
                var str = "a=1&b=2&c=3"
                var arr = str.toQueryParams();
                for(i in arr){
                     alert(arr[i]);//输出1,2,3
               }

            10.String.prototype.toArray()
                把字符串转换成字符数组
                示例:
                var str = "test"; 
                //依次输出"t,e,s,t"
               str.toArray().each(
                    function(item){
                       alert(item);
                   }
               );

            11.String.prototype.extractScripts()
                从字符串中提取出所有的<script>脚本,以字符串数组的形式返回
                示例:
                var str = "this is a test<script>alert('ok')<"+"/script>";
               str += str;
                //输出两遍alert('ok')
               str.extractScripts().each(
                   function(item){
                       alert(item); 
      }
               );
 

            12.String.prototype.camelize()
                将一个以连字符连接的字符串转换成一个遵循骆驼命名法的字符串
                示例:
                var str = "this-is-a-test";  
                //输出"thisIsATest"
               alert(str.camelize());

时间: 2024-09-17 04:23:23

ajax入门指南(五)的相关文章

ajax入门指南(三)

ajax入门指南,相信对ajax初学者会有所帮助. AJAX的主流框架:       浏览器端框架:       一.Prototype系列:         1.Prototype:http://prototype.conio.net,如果在Web应用中实现对Ajax的支持或者需要扩展一些基本的功能,Prototype是个很好的选择:         2.script.aculo.us:http://script.aculo.us,如果要在Web应用中实现更加在丰富的动态效果,提升用户体验,可

ajax入门指南(二)

ajax入门指南,相信对ajax初学者有所帮助. javascript面向对象编程实现:             1.类的声明:                 function test1(){                     this.p1 = "p1";                     this.p2 = "p2";                     this.f1 = function(){ alert("f1");

ajax入门指南(一)

ajax入门指南,对开始学习ajax的朋友应该有所帮助. 1.AJAX兼容IE和Firefox两大浏览器,出现了AJAX开发框架.      2.AJAX开发关键技术:XMLHttpRequest对象,JavaScript编程技术,DOM(文档对象模型),CSS(层叠样式表),和XSLT(可扩展样式表转换)            XMLHttpRequest对象是实现Ajax应用的核心:            JavaScript是Ajax应用在客户端使用的脚本语言:            通过

ajax入门指南(七)

ajax学习入门指南,对ajax初学者会有所帮助.    Prototype框架         页面插入         1.Insertion.Before类                 新建Insertion.Before类的实例,会将指定的HTML添加到指定元素之前,并且与之相邻                 示例:                 <div id="div1">original text</div>                

ajax入门指南(六)

ajax学习入门指南,相信对ajax初学者会有所帮助的.  Prototype框架     枚举对象(Enumerable对象)         1.Enumerable.each(iterator)         each方法的参数是一个JavaScript函数,它可以接受两个参数,它们分别是当前遍历的集合元素和当前遍历元素在集合中的序号         示例:         var arr = [1,2,3,4];         arr.each(            functio

ajax入门指南(四)

ajax学习入门指南,对ajax初学者应该有所帮助. Prototype对Ajax的支持     Ajax.Request类     如下代码是一个示例:     <!--客户端:index.htm-->     <script language="javascript" type="text/javascript" src="prototype1.6.js"></script>     <script

Firebug入门指南

据说,对于网页开发人员来说,Firebug是Firefox浏览器中最好的插件之一. 我最近就在学习怎么使用Firebug,网上找到一篇针对初学者的教程,感觉比较有用,就翻译了出来. ================= Firebug入门指南 作者:Estelle Weyl 原文网址:http://www.evotech.net/blog/2007/06/introduction-to-firebug/ 译者:阮一峰 本文是Firebug的一个概览,并不对它的所有特性进行详尽解释.不过,本文的内容

AJAX入门--- XMLHttpRequest对象的属性和方法

         由于刚刚接触到Ajax对其比较陌生,而其中的XMLHttpRequest对象更是未曾听闻.开始学之前,了解一下它的属性和方法为它的使用做下铺垫.本文重点介绍XMLHttpRequest的属性和方法.          XMLHttpRequest对象的属性和事件 属性 描述 readyState 表示XMLHttpRequest对象的状态[1] responseText 包含客户端接收到的HTTP相应的文本内容[2] responseXML 服务器响应的XML内容对应的DOM对

AJAX入门---点滴的积累

AJAX入门---点滴的积累                    每次学习完一个内容总会写上几句话总结一下学习的内容.这不刚看完王兴魁老师讲的AJAX核心技术,现在回顾梳理一下.这套视频的内容不多,简单的讲解了XMLHttpRequest技术,DOM及其操作HTML.XML,一些Javascript的知识,再通过两个综合性的例子收尾.          XMLHttpRequest对象            关于该对象的具体含义,如何使用可以看看我之前写的博客--<AJAX入门--- XMLH