Javascript,Jquery笔记

200cc

浏览: 68337 次
性别:
来自: 福州

最近访客更多访客>>

wrx7998

dn163

LSSss

can_do

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

javascript
笔记
jquery

常用js函数(转载)
http://www.cnblogs.com/sicd/p/4310768.html

事件处理

var EventUtil = {
       addHandler : function(element, type, handler){
            if(element.addEventListener){
                    element.addEventListener(type, handler, false);    
            }else if(element.attachEvent){
                     element.attachEvent("on"+type,handler);
            }else{
                     element["on"+type]=handler;
            }
       },
        removeHandler : function(element, type, handler){
            if(element.removeEventListener){
                  element.removeEventListener(type, handler, false);
           }else if(element.detachEvent){
                   element.detachEvent("on"+type, handler);
           }else{
                  element["on"+type]=null;
           }
       }
 } ;

随机数

rand = (function(){
  var today = new Date(); 
  var seed = today.getTime();
  function rnd(){
    seed = ( seed * 9301 + 49297 ) % 233280;
    return seed / ( 233280.0 );
  };
  return function rand(number){
    return Math.ceil(rnd(seed) * number);
  };
})();

window.console处理

(function() {
    var method;
    var noop = function () {};
    var methods = [
        'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
        'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
        'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
        'timeStamp', 'trace', 'warn'
    ];
    var length = methods.length;
    var console = (window.console = window.console || {});

    while (length--) {
        method = methods[length];

        // Only stub undefined methods.
        if (!console[method]) {
            console[method] = noop;
        }
    }
}());

$.ajax + Spring MVC

$.ajax({
	async : true , 
	type : 'POST', 
	url:'someurl', 
	contentType: "application/json; charset=utf-8", //
	processData:false, //To avoid making query String instead of JSON
	data: JSON.stringify({}), //some parameters. Json Object.
	success: function(data){
	},
	error: function(e){
	}
});

@RequestMapping("/someurl")
	public @ResponseBody Map<String, Object> someMethod(@RequestBody Map<String, Object> params){
		//do sth.
	}

window.location

location = {  
    host: "localhost:8080",   
    hostname: "localhost",   
    href: "http://localhost:8080/webcontext/index.html",   
    origin: "http://localhost:8080",   
    pathname: "/webcontext/index.html",   
    port: "8080",   
    protocol: "http:",   
    reload: function reload() { [native code] },   
    replace: function () { [native code] },   
    ...  
};  

location.pathname = 'someUrl'; // 跳转到http://localhost:8080/someUrl
location.href = 'someUrl'; //跳转到http://localhost:8080/webcontext/someUrl
location.href = 'http://www.google.com'; //跳转到http://www.google.com

实用技巧

//随机数
var MIN = 1, MAX=10;
Math.floor(Math.random()*MAX); //  [0 , MAX)  ~~ 0-9
Math.floor(Math.random()*(MAX-MIN+1)) + MIN; // [MIN, MAX] ~~ 1-10

//随机字符串 [0-9a-z]+
Math.random().toString(36).substr(2); //将随机小数转为36进制数并截去起始的'0.'

//截去前后空格 trim
String.prototype.trim = function() { return this.replace(/^\s+|\s+$/g, "") ;}

//四舍五入
3.1415926.toFixed(4); // 保留n位小数 3.1416
3.1415925.toPrecision(4); //保留n位数字 3.142
1234.1234.toPrecision(2); // 1.2e+3 

//遍历属性
for (var i in object) {
  if (object.hasOwnProperty(i)) { //避免访问到object.prototye的属性
    //do sth.
  }
}

// 遍历属性到数组
var a = [];
for (a[a.length] in obj); 
// a[a.length]初始为undefined, 且a.length是不断增长的, 则随着循环,a[a.length]被依次赋值为obj的keys
return a;

//数组遍历. 不使用for in的方式来遍历数组
for (var i=0, len=array.length; i < len; i++) {// i, len都只取值一次
  //do sth.
}

递归

var array = [
  {id:1, pid:0, name:'node1', level:0},
  {id:2, pid:0, name:'node2', level:0},
  {id:3, pid:1, name:'node1-1', level:1},
  {id:4, pid:3, name:'node1-1-1', level:2},
  {id:5, pid:1, name:'node1-2', level:1},
  {id:6, pid:2, name:'node2-1', level:1},
  {id:7, pid:6, name:'node2-1-1', level:2},
];

//MAX LEVEL
var maxLevel = array.map(function(n){ return n.level }).reduce(function(pre, cur){ return pre > cur ? pre : cur });

// 递归
var root = { id : 0 , name : 'root' };
//(function(node){ //---> 匿名
(function addChilds(node) { //<--- 非匿名
  var childs = array.filter(function(n) { return n.pid == node.id });
  if (childs && childs.length > 0) {
    node.children = [];
    for (var i = 0, len = childs.length; i < len ; i++) {
      var child = childs[i];
      node.children.push(child);
      //arguments.callee(child); //---> 匿名
      addChilds(child); //<--- 非匿名
    }
  }
})(root);
/** ---JSON.stringify(root)---
{
    "id":0,
    "name":"root",
    "children":[
        {
            "id":1,
            "pid":0,
            "name":"node1",
            "level":0,
            "children":[
                {
                    "id":3,
                    "pid":1,
                    "name":"node1-1",
                    "level":1,
                    "children":[
                        {
                            "id":4,
                            "pid":3,
                            "name":"node1-1-1",
                            "level":2
                        }
                    ]
                },
                {
                    "id":5,
                    "pid":1,
                    "name":"node1-2",
                    "level":1
                }
            ]
        },
        {
            "id":2,
            "pid":0,
            "name":"node2",
            "level":0,
            "children":[
                {
                    "id":6,
                    "pid":2,
                    "name":"node2-1",
                    "level":1,
                    "children":[
                        {
                            "id":7,
                            "pid":6,
                            "name":"node2-1-1",
                            "level":2
                        }
                    ]
                }
            ]
        }
    ]
}
*/

日期格式化

var dateFormat = function (date, formatter) {
    date = date || new Date();
    formatter = formatter || "yyyy-MM-dd HH:mm:ss";
    
    var zeroize = function (value, length) {
        length = length || 2;
        value = new String(value);
        for (var i = 0, zeros = '', len = length - value.length; i < len; i ++) {
            zeros += '0';
        }
        return zeros + value;
    }

    var reg = /"[^"]*"|'[^']*'|\b(?:yy(?:yy)?|([MdHms])\1?|[S])\b/g;
    return formatter.replace(reg, function ($0) {
        switch ($0) {
        case 'd': return date.getDate();
	case 'dd': return zeroize(date.getDate());
	case 'M': return date.getMonth() + 1;
	case 'MM': return zeroize(date.getMonth() + 1);
	case 'yy': return new String(date.getFullYear()).substr(2);
	case 'yyyy': return date.getFullYear();
	case 'H': return date.getHours();
	case 'HH': return zeroize(date.getHours());
	case 'm': return date.getMinutes();
	case 'mm': return zeroize(date.getMinutes());
	case 's': return date.getSeconds();
	case 'ss': return zeroize(date.getSeconds());	
	case 'S': return zeroize(date.getMilliseconds(), 3);
        }
    });
}

序列化

$.fn.serializeObject = function(){
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

类型判断

$.isString = jQuery.fn.isString =function (/*anything*/it) {
return (typeof it =="string"|| it instanceof String); // Boolean
 }

 $.isArray = jQuery.fn.isArray =function (/*anything*/it) {
return it && (it instanceof Array ||typeof it =="array"); // Boolean
 }

 $.isFunction = jQuery.fn.isFunction =function (/*anything*/it) {
return opts.call(it) ==="[object Function]";
 };

 $.isObject = jQuery.fn.isObject =function (/*anything*/it) {
return it !== undefined &&
 (it ===null||typeof it =="object"|| $.isArray(it) || $.isFunction(it)); // Boolean
 }

 $.isArrayLike = jQuery.fn.isArrayLike =function (/*anything*/it) {
return it && it !== undefined &&// Boolean
!$.isString(it) &&!$.isFunction(it) &&
!(it.tagName && it.tagName.toLowerCase() =='form') &&
 ($.isArray(it) || isFinite(it.length));
 }

outerHtml

$.fn.outerHtml = function(){
	return $("<p>").append(this.clone()).html();
};

表单清空

$(':input','someFormSelector')  
	.not(':button, :submit, :reset, :hidden')  
	.val('')  
	.removeAttr('checked')  
	.removeAttr('selected');

console tips

console.log("%c", "font-size:0;line-height:99px;padding:49px 50px;background:url(http://q1.qlogo.cn/g?b=qq&k=eT5IegWnWO37UVZhAPfatA&s=100) no-repeat");

console.log("%chello%cworld%c!", "color:#0080FF", "color:#439C79", "color:#0080FF");

在JS文件中引用外部JS文件

document.write("<script language='javascript' src='someUrl/someScript.js' charset='utf-8'></script>");
//注意charset!!

jquery.cookie.js(我写了半天还不如源码清晰明白, orZ)

/*!
 * jQuery Cookie Plugin v1.4.0
 * https://github.com/carhartl/jquery-cookie
 *
 * Copyright 2013 Klaus Hartl
 * Released under the MIT license
 */
(function (factory) {
	if (typeof define === 'function' && define.amd) {
		// AMD
		define(['jquery'], factory);
	} else if (typeof exports === 'object') {
		// CommonJS
		factory(require('jquery'));
	} else {
		// Browser globals
		factory(jQuery);
	}
}(function ($) {

	var pluses = /\+/g;

	function encode(s) {
		return config.raw ? s : encodeURIComponent(s);
	}

	function decode(s) {
		return config.raw ? s : decodeURIComponent(s);
	}

	function stringifyCookieValue(value) {
		return encode(config.json ? JSON.stringify(value) : String(value));
	}

	function parseCookieValue(s) {
		if (s.indexOf('"') === 0) {
			// This is a quoted cookie as according to RFC2068, unescape...
			s = s.slice(1, -1).replace(/\\"/g, '"').replace(/\\\\/g, '\\');
		}

		try {
			// Replace server-side written pluses with spaces.
			// If we can't decode the cookie, ignore it, it's unusable.
			// If we can't parse the cookie, ignore it, it's unusable.
			s = decodeURIComponent(s.replace(pluses, ' '));
			return config.json ? JSON.parse(s) : s;
		} catch(e) {}
	}

	function read(s, converter) {
		var value = config.raw ? s : parseCookieValue(s);
		return $.isFunction(converter) ? converter(value) : value;
	}

	var config = $.cookie = function (key, value, options) {

		// Write

		if (value !== undefined && !$.isFunction(value)) {
			options = $.extend({}, config.defaults, options);

			if (typeof options.expires === 'number') {
				var days = options.expires, t = options.expires = new Date();
				t.setTime(+t + days * 864e+5);
			}

			return (document.cookie = [
				encode(key), '=', stringifyCookieValue(value),
				options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
				options.path    ? '; path=' + options.path : '',
				options.domain  ? '; domain=' + options.domain : '',
				options.secure  ? '; secure' : ''
			].join(''));
		}

		// Read

		var result = key ? undefined : {};

		// To prevent the for loop in the first place assign an empty array
		// in case there are no cookies at all. Also prevents odd result when
		// calling $.cookie().
		var cookies = document.cookie ? document.cookie.split('; ') : [];

		for (var i = 0, l = cookies.length; i < l; i++) {
			var parts = cookies[i].split('=');
			var name = decode(parts.shift());
			var cookie = parts.join('=');

			if (key && key === name) {
				// If second argument (value) is a function it's a converter...
				result = read(cookie, value);
				break;
			}

			// Prevent storing a cookie that we couldn't decode.
			if (!key && (cookie = read(cookie)) !== undefined) {
				result[name] = cookie;
			}
		}

		return result;
	};

	config.defaults = {};

	$.removeCookie = function (key, options) {
		if ($.cookie(key) === undefined) {
			return false;
		}

		// Must not alter options, thus extending a fresh object...
		$.cookie(key, '', $.extend({}, options, { expires: -1 }));
		return !$.cookie(key);
	};

}));

分享到：

Spring笔记 | <转载>PJAX的实现与应用实例

2014-04-16 09:49
浏览 898
评论(0)
分类:Web前端
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Javascript,Jquery笔记

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

Javascript,Jquery笔记

评论

发表评论

相关推荐

在github上搭建blog

javascript原生api

javascript的闭包

Android Studio 笔记

Linux笔记

Android 笔记

银行卡号验证算法及js实现

js file

Maven笔记

eclipse笔记

Java笔记

JS农历插件

jquery的事件委托

<转载> javascript模版引擎-tmpl的bug修复与性能优化

coffee script笔记

nodejs笔记

vim笔记

Spring笔记

<转载>PJAX的实现与应用实例

Oracle数据库笔记

最近访客更多访客>>