js常用方法

          我在项目中常用的一些技js方法(因为是我自己用的所以某些方法不是很严谨 见谅 另外就是提供个参考)

1.阻止事件

//阻止事件冒泡
function stopBubble(e) { 
  var evt = e ? e : window.event;
//如果提供了事件对象,则这是一个非IE浏览器 
if (evt.stopPropagation) 
    //因此它支持W3C的stopPropagation()方法 
    evt.stopPropagation(); 
else 
    //否则,我们需要使用IE的方式来取消事件冒泡 
    evt.cancelBubble = true; 
}
//阻止浏览器的默认行为 
function stopDefault(e) { 
   var evt = e ? e : window.event;
    //阻止默认浏览器动作(W3C) 
    if (evt.preventDefault ) 
        evt.preventDefault(); 
    //IE中阻止函数器默认动作的方式 
    else 
        evt.returnValue = false; 
    return false; 
}

 2.获取地址栏参数

/**
 * 获取地址栏参数
 * @param{string} name参数名称
 */
function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if(r != null) return unescape(r[2]);
    return null;
};

3.地址栏参数拼接(添加)

/**
 * 地址参数拼接
 * @param{string} url 链接
 * @param{string} name 参数key
 * @param{string} value 参数value
 */
function urlUpdateParams(url, name, value) {
	var r = url;
	if(r != null && r != 'undefined' && r != "") {
		value = encodeURIComponent(value);
		var reg = new RegExp("(^|)" + name + "=([^&]*)(|$)");
		var tmp = name + "=" + value;
		if(url.match(reg) != null) {
			r = url.replace(eval(reg), tmp);
		} else {
			if(url.match("[\?]")) {
				r = url + "&" + tmp;
			} else {
				r = url + "?" + tmp;
			};
		};
	};
	return r;
};
//eval(reg)这个方法可能不太符合规范 不过我现在一直在用 没发现什么问题

4.获取元素data属性

/**
 * 获取元素data属性 并转换成json格式返回
 *  @param{string}  elem js的element
 */
function parseDataAttr(elem) {
	var options = {};
	for(var opt in elem.dataset) {
		if(elem.dataset.hasOwnProperty(opt)) {
			try {
				options[opt] = JSON.parse(elem.dataset[opt]);
			} catch(_) {
				options[opt] = elem.dataset[opt];
			}
		}
	}
	return options;
}

5.上传图片获取图片路径预览功能

//方法一
function getObjectURL(file) {
	var url = null;
	if(window.createObjectURL != undefined) {
		url = window.createObjectURL(file);
	} else if(window.URL != undefined) {
		url = window.URL.createObjectURL(file);
	} else if(window.webkitURL != undefined) {
		url = window.webkitURL.createObjectURL(file);
	};
	return url;
};
//调用


function readFile(elem) {
	var fileList = elem.files;
	var imgSrc = getObjectURL(fileList[0]);
    //如果需要展示当前选中的图片:
    document.getElementsByTagName('img')[0].setAttribute('src',imgSrc)
}


//方法二
function readFile(obj) {
	var _this = $(obj);
	var fileList = obj.files;
	if(!fileList[0])
		return
	var reader = new FileReader();
	reader.readAsDataURL(fileList[0]);
	reader.onload = function(e) {
          //do something
    document.getElementsByTagName('img')[0].setAttribute('src',imgSrc)
	}
}


6.合并json数据(js方法)

//简单方法
var a = {a:1};
var b = {b:2};
var c = Object.assign(a,b); // 原对象改变
var d = Object.assign({},a,b); // 原对象不改变

//自己写个方法 很简陋 因为需求不高所以就没有些太复杂的
function extend(json1, json2) {
	for(var p in json2) {
		if(json2.hasOwnProperty(p))
			json1[p] = json2[p];
	}
	return json1
}

7.数字保留两位小数

/**
 * 保留两位小数 (不是很严谨)保留小数长度可更改
 *  @param{number}  val 需要保留长度的数字
 *  @param{element} el  当前输入框元素
 *  @param{number} leave  保留小数的长度不传默认为2
 */

function leaveTwinNum(val, el, leave) {
	var num = 2
	if(leave && myPack.verify.numberVer(leave)) {
		num = leave;
	};
	if(isNaN(val)) {
		el.val("");
		return;
	};
	var str = val.toString().split(".")[1];
	if(str) {
		if(str.length > num) {
			var be = val.toString().split(".")[0];
			el.val(be + '.' + str.substring(0, num));
		};
	};
};

8.移除数组中的某个值

/**
 * 移除数组中的某个值
 *  @param{object}  array 数组
 *  @param{number||str}  tag需要移除的目标
 */
function remove_array(array, tag) {
	for(var i = 0; i < array.length; i++) {
		var temp = array[i];
		if(!isNaN(tag)) {
			temp = i;
		};
		if(temp == tag) {
			for(var j = i; j < array.length; j++) {
				array[j] = array[j + 1];
			};
			array.length = array.length - 1;
		};
	};
}

9.判断数组中是否存在某个值

/**
 * 判断数组中是否存在某个值
 *  @param{object}  array 数组
 *  @param{number||str}  tag 需要判断的目标
 */
function in_array(array, tag) {
	for(var i = 0; i < array.length; i++) {
		if(array[i] == tag) {
			return true;
		};
	};
	return false;
};

10封装localStorage和sessionStorage

//封装storage
var Storage = {
	getStorage: function(key) {
		var value = localStorage.getItem(key);
		if(value) {
			try {
				var value_json = JSON.parse(value);
				if(typeof value_json === 'object') {
					return value_json;
				} else if(typeof value_json === 'number') {
					return value_json;
				}
			} catch(e) {
				return value;
			}
		} else {
			return false;
		}
	},
	setStorage: function(key, value) {
		localStorage.setItem(key, value);
	},
	removeStorage: function(key) {
		localStorage.removeItem(key);
	},
	clearStorage: function() {
		localStorage.clear();
	},
	getSession: function(key) {
		var value = sessionStorage.getItem(key);
		if(value) {
			try {
				var value_json = JSON.parse(value);
				if(typeof value_json === 'object') {
					return value_json;
				} else if(typeof value_json === 'number') {
					return value_json;
				}
			} catch(e) {
				return value;
			}
		} else {
			return false;
		}
	},
	setSession: function(key, value) {
		sessionStorage.setItem(key, value);
	},
	removeSession: function(key) {
		sessionStorage.removeItem(key);
	},
	clearSession: function() {
		sessionStorage.clear();
	}
};

 

你可能感兴趣的:(javascript)