分享别人写的一个小型js框架

主要是集成了常用的扩展,包括Dom与String、Array、StringBuffer、NameSpace等,当然还少不了Ajax。体积约8k。因为严格控制体积,所以功能有限。如果只要Ajax部分,就1k而已。

这个小框架已经应用到公司的项目,并开始逐步在前端展示页面上接替prototype.js。以后将围绕这个框架做一些应用。

代码如下:

/*
*    My JavaScript Framework
*    Version    :    1.0 beta
*    Author    :    misshjn
*    Email    :    misshjn@163.com
*/
function NameSpace(){};
function StringBuffer(){this.data = []};

var Method = {
    Version : "1.0 beta",
    Element    : function(){
        this.version = Method.Version;
        this.hide = function(){this.style.display="none"; return this};
        this.show = function(){this.style.display=""; return this};
        this.getStyle = function(s){
            var value = this.style[s.camelize()];
            if (!value){
                if (this.currentStyle) {
                    value = this.currentStyle[s.camelize()];
                }else if (document.defaultView && document.defaultView.getComputedStyle) {
                    var css = document.defaultView.getComputedStyle(this, null);
                    value = css ? css.getPropertyValue(s) : null;
                }
            }
            return value;
        };
        this.setStyle = function(s){
            var sList = s.split(";");
            for (var i=0,j; j=sList[i]; i++){
                var k = j.split(":");
                this.style[k[0].trim().camelize()] = k[1].trim();
            }
            return this;
        };
        this.toggle = function(){this.getStyle("display")=="none"?this.setStyle("display:"):this.setStyle("display:none"); return this};
        this.hasClassName = function(c){return this.className.hasSubString(c," ")?true:false;};
        this.addClassName = function(c){if(!this.hasClassName(c)){this.className+=" "+c};return this};
        this.removeClassName = function(c){if(this.hasClassName(c)){this.className = (" "+this.className+" ").replace(" "+c+" "," ").trim(); return this}};
        this.getElementsByClassName = function(c){return this.getElementsByAttribute("className",c)};
        this.getElementsByAttribute = function(n,v){ //name,value;
            var elems = this.getElementsByTagName("*");
            var elemList = [];
            for (var i=0,j; j=elems[i]; i++){
                var att = j[n] || j.getAttribute(n);
                if (att==v){
                    elemList.push(j);
                }
            }
            return elemList;
        };
        this.parentIndex = function(p){
            if (this==p){return 0}            
            for (var i=0,n=this; n=n.parentNode; i++){
                if(n==p){return i;}
                if(n==document.documentElement) return -1;
            }
        }
        this.nextElement = function(){
            var n = this;
            for (var i=0,n; n = n.nextSibling; i++){
                if(n.nodeType==1) return $(n);
            }
            return null;
        };
        this.previousElement = function(){
            var n = this;
            for (var i=0,n; n = n.previousSibling; i++){
                if(n.nodeType==1) return $(n);
            }
            return null;
        };
        this.moveAhead = function(){
            if (this.previousElement()){
                this.parentNode.insertBefore(this,this.previousElement());
            }
            return this;
        };
        this.moveBack = function(){
            var n = this.nextElement();
            if (n){
                this.parentNode.removeChild(n);
                this.parentNode.insertBefore(n,this);
            }
            return this;
        };
    },
    Array :    function(){
        this.indexOf = function(){
            for (i=0; i<this.length; i++){
                if (this[i]==arguments[0])
                    return i;
            }
            return -1;
         };
        this.lastIndexOf = function(){
            for (i=this.length-1; i>=0; i--){
                if (this[i]==arguments[0])
                    return i;
            }
            return -1;
        };
        this.each = function(fn){
            for (var i=0,len=this.length; i<len; i++){
                fn(this[i]);
            }
            return this;
        };
    },
    String : function(){
        this.trim = function(){
            var _re,_argument = arguments[0] || " ";
            typeof(_argument)=="string"?(_argument == " "?_re = /(^\s*)|(\s*$)/g : _re = new RegExp("(^"+_argument+"*)|("+_argument+"*$)","g")) : _re = _argument;
            return this.replace(_re,"");
        };
        this.ltrim = function(){
            var _re, _argument = arguments[0] || " ";
            typeof(_argument)=="string"?(_argument == " "?_re = /(^\s*)/g : _re = new RegExp("(^"+_argument+"*)","g")) : _re = _argument;
            return this.replace(_re,"");
        };
        this.rtrim = function(){
            var _re, _argument = arguments[0] || " ";
            typeof(_argument)=="string"?(_argument == " "?_re = /(\s*$)/g : _re = new RegExp("("+_argument+"*$)","g")) : _re = _argument;
            return this.replace(_re,"");
        };
        this.concat = function(){
            var s = new StringBuffer();
            s.append(this);
            for (var i=0,j; j=arguments[i]; i++){
                s.append(typeof j=="object" ? j.join("") : j);
            }
            return s.toString();
        };
        this.stripTags = function(){
            return this.replace(/<\/?[^>]+>/gi, '');
        };
        this.cint = function(){
            return this.replace(/\D/g,"")-0;
        };
        this.camelize = function(){
            return this.replace(/(-\S)/g,function($1){return $1.toUpperCase().substring(1,2)})
        };
        this.hasSubString = function(s,f){
            if(!f) f="";
            var v = (f+this+f).indexOf(f+s+f);
            return v==-1?false:v;
        };
        this.toXMLString = function(){
            var arr = arguments[0].split("&");
            var str = new StringBuffer();
            for (var i=0,len=arr.length; i<len; i++){
                var item = arr[i].split("=");
                str.append("<"+item[0]+"><![CDATA["+item[1]+"]]></"+item[0]+">");
            }
            return str.toString();
        };
        this.URLEncode = function(){ return encodeURIComponent(this)};
        this.URLDecode = function(){ return decodeURIComponent(this)};
    },
    StringBuffer : function(){
        this.append = function(){this.data.push(arguments[0]);return this};
        this.toString = function(){return this.data.join(arguments[0]||"")};
        this.length = function(){return this.data.length};
    },
    NameSpace : function(){
        this.copyChild = this.appendChild = function(ns){
            for (var key in ns){
                this[key] = ns[key];
            }
            return this;
        };
    }
};

Method.Array.apply(Array.prototype);
Method.String.apply(String.prototype);
Method.StringBuffer.apply(StringBuffer.prototype);
Method.NameSpace.apply(NameSpace.prototype);

function $(){
    var elem = typeof(arguments[0])=="string"?document.getElementById(arguments[0]):arguments[0];
    if (!elem){return null}
    if (elem["version"]){return elem}
    if ( arguments[1] == undefined || arguments[1]==true ){Method.Element.apply(elem);}
    return elem;
};
$(document);

var Ajax={
    xmlhttp:function (){
        try{
            return new ActiveXObject('Msxml2.XMLHTTP');
        }catch(e){
            try{
                return new ActiveXObject('Microsoft.XMLHTTP');
            }catch(e){
                return new XMLHttpRequest();
            }
        }
    }
};
Ajax.Request=function (){
    if(arguments.length<2)return ;
    var para = {asynchronous:true,method:"GET",parameters:""};
    for (var key in arguments[1]){
        para[key] = arguments[1][key];
    }
    var _x=Ajax.xmlhttp();
    var _url=arguments[0];
    if(para["parameters"].length>0) para["parameters"]+='&_=';
    if(para["method"].toUpperCase()=="GET") _url+=(_url.match(/\?/)?'&':'?')+para["parameters"];
    _x.open(para["method"].toUpperCase(),_url,para["asynchronous"]);
    _x.onreadystatechange=function (){
        if(_x.readyState==4){
            if(_x.status==200)
                para["onComplete"]?para["onComplete"](_x):"";
            else{
                para["onError"]?para["onError"](_x):"";
            }
        }
    };
    if(para["method"].toUpperCase()=="POST")_x.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

for (var ReqHeader in para["setRequestHeader"]){
        _x.setRequestHeader(ReqHeader,para["setRequestHeader"][ReqHeader]);
    }
    _x.send(para["method"].toUpperCase()=="POST"?(para["postBody"]?para["postBody"]:para["parameters"]):null);

};

var Cookies = {
    get : function(n){
        var dc = "; "+document.cookie+"; ";
        var coo = dc.indexOf("; "+n+"=");
        if (coo!=-1){
            var s = dc.substring(coo+n.length+3,dc.length);
            return unescape(s.substring(0, s.indexOf("; ")));
        }else{
            return null;
        }
    },
    set : function(name,value,expires){
        var expDays = expires*24*60*60*1000;
        var expDate = new Date();
        expDate.setTime(expDate.getTime()+expDays);
        var expString = expires ? "; expires="+expDate.toGMTString() : "";
        var pathString = ";path=/";
        document.cookie = name + "=" + escape(value) + expString + pathString;
    },
    del : function(n){
        var exp = new Date();
        exp.setTime(exp.getTime() - 1);
        var cval=this.get(n);
        if(cval!=null) document.cookie= n + "="+cval+";expires="+exp.toGMTString();
    }
}

function $A(list){
    var arr = [];
    for (var i=0,len=list.length; i<len; i++){
        arr[i] = list[i];
    }
    return arr;
}
function $D(str){return str.URLDecode();}
function $E(str){return str.URLEncode();}
function $V(id){return $(id).value}
function request(paras){
    var url = location.href;
    var paraString = "&"+url.substring(url.indexOf("?")+1,url.length)+"&";
    if (paraString.indexOf("&"+paras+"=")==-1){return ""};
    paraString = paraString.substring(paraString.indexOf("&"+paras+"=")+paras.length+2,paraString.length);
    return paraString.substring(0,paraString.indexOf("&"));
}

(0)

相关推荐

  • 前端框架Vue.js构建大型应用浅析

    真正的模块化 前端模块化很早就开始了,无论是 require.js,browserify 进行模块化打包, 还是 Angular 进行依赖注入,我们都可以把JS代码分成一个个小的模块并组装起来.然后我们还会通过 less 或者 sass 来把CSS文件也拆成一个个小的模块来写,甚至我们在CSS代码中感受到了 封装,继承,多态 等面向对象的特性. 然而,在 webpack 出来之前,我们所谓的模块化根本不能算作模块化.为什么这么讲,因为我们存在一个重要的问题没有解决,就是JS模块对CSS模块的依赖

  • 第一次接触神奇的前端框架vue.js

    前言 入手2016最火前端框架之一vue.js.大概从网上找了些资料看了下vue.js,从网上的资料来看只能惊叹其发展速度太快,让我意外的是其作者是华人的前提下作品这么受欢迎. 网上的博客和教程各种组合.以至于我都有些感觉out.各种vue+webpack.vue+react.vue+es6+npm等等.琳琅满目.真是三天不学习赶不上刘少奇. 开篇主要是初次了解下vue.js,包括v-model.v-if.v-else.v-show.v-for(2.0对$index和$key舍弃,2.0要用in

  • JavaScript的Backbone.js框架的一些使用建议整理

    Backbone 为复杂Javascript应用程序提供模型(models).集合(collections).视图(views)的结构.其中模型用于绑定键值数据和自定义事件:集合附有可枚举函数的丰富API: 视图可以声明事件处理函数,并通过RESTful JSON接口连接到应用程序. 当我们开发含有大量Javascript的web应用程序时,首先你需要做的事情之一便是停止向DOM对象附加数据. 通过复杂多变的jQuery选择符和回调函数创建Javascript应用程序,包括在HTML UI,Ja

  • Bootstrap整体框架之JavaScript插件架构

    本文实例为大家介绍了JavaScript插件架构的知识点,供大家参考,具体内容如下 1. JavaScript插件架构 如下是插件alert的全部代码,每个插件都定义在如下类似的作用域中: +function ($) { 'use strict'; // ALERT CLASS DEFINITION // ====================== var dismiss = '[data-dismiss="alert"]' var Alert = function (el) { $

  • 十大热门的JavaScript框架和库

    JavaScript 框架和库可以说是开源项目中最庞大也是最累的类目了,目前在github 上这一类的项目是最多的,并且几乎每隔一段时间就会出现一个新的项目席卷网络社区,虽然这样推动了创新的发展,但不得不说苦了前端的开发者们.因此本文罗列出了一些优秀的 Javascript 框架和库的特及其在 github 上的 star 数,旨在为各位开发者提供一些参考. 1.ReactJS(Star: 59989,Fork: 10992) 主页:https://facebook.github.io/reac

  • 移动端脚本框架Hammer.js

    一.前言 移动端框架当前还处在初级阶段,但相对于移动端的应用来说已经有很长时间了.虽然暂时还没有PC端开发的需求量大,但移动端的Web必然是一种趋势,在接触移动端脚本的过程中,最开始想到的是juqery.Jquery2.0版本及以上已经开始偏向移动端,如对h5的支持,但支持还是不够完善,希望jq在后面的版本能够逐渐支持起来. 最初在开发移动端Web的时候使用w3c标准的语法结构和原生的js开发,但相对来说开发量比较大,而且每一步都要考虑各移动端浏览器的兼容,像比较让程序员头痛的大wp手机,很多事

  • 详细介绍8款超实用JavaScript框架

    1. Hammer.jsHammer.js是被广泛使用的轻量级JavaScript框架,它提供了常用触摸操作的规范,比如收缩.拖放.双击和删除等等.它支持大多数移动平台像iOS,Windows Mobile, Android 和 BlackBerry. 2. jQuery UIjQuery UI非常适合那些用jQuery JS 库开发App的用户.提到jQuery UI,就不得不提到跟它非常相似的Kendo UI.Kendo UI可帮助创建原生的移动和桌面应用,对性能和易用性方面都做了大量优化,

  • 2014年最火的Node.JS后端框架推荐

    Node.js框架是可以帮助你建立网站应用服务的javascript框架.它可以帮助你更快地开发Web应用 Node.js 是基于Chrome的JavaScript运行环境.可方便地构建快速.可扩展的网络应用.节点. 当涉及到Web应用程序的开发,你就需要JS框架,加快你的开发过程. Node.js有非常多不同类型的框架,如MVC框架,REST API和generators,全栈框架,大量的服务器库,它完全能够提供Web服务,无需使用Apache等外部软件. Node.js使用谷歌的V8 Jav

  • AngularJs Javascript MVC 框架

    在6月google发布了AngularJs 1.0稳定版, 并宣称:AngularJS可以让你扩展HTML的语法,以便清晰.简洁地表示应用程序中的组件,并允许将标准的HTML作为你的模板语言,AngularJS可以通过双向数据绑定自动从拥有JavaScript对 象(模型)的UI(视图)中同步数据. 开始接触AngularJs是在4月份来到新项目组,这时AngularJs还处于0.8未稳定版,项目中已经开始使用了,并且这套框架应用到了项目整个UI端,服务端也是未稳定的web api,真心佩服团队

  • JavaScript的Backbone.js框架入门学习指引

    1.简介 最近在做一个大型网上银行项目前端的优化,需要使用一个胖客户端的优化,大概思路就是前端通过Ajax 请求去后端获取数据,以Jason的格式返回,然后显示在页面上.由于这个系统非常庞大,胖客户端方案难免需要在客户端写大量的JS代码.我想对于任何团队来说,大量的,非结构化的代码维护起来都非常的不方便.所以BackBone进入了我的视线. 它提供了一种途径可以让你结构化你的JS代码,让你以面向对象的方式来组织你的前端JS代码.这就好比我们在前端应用Domain Driven Design. 我

随机推荐