我自己的Javascript 庫，封裝了一些常用函式
/**
@ Name : Kingwell Javascript Library
@ Author :kingwell
@ Date : 2012-8-22
@ Email : jinhua.leng##gmail.com
@ Version : 1.2
@ Update : http://kingwell-leng.iteye.com/blog/1570768
功能：
1: $ID選擇
2： 事件繫結，事件移除，獲取事件目標
3： 阻止冒泡，阻止預設事件
4： 顯示隱藏
5： 去除HTML
6： 去除首尾空格
7： 獲取URL引數
8： Cookie操作，設定，刪除，獲取
9： 清除所有Cookie
10：表格排序
11: 動態轉入Javascript
12: 封裝Ajax
13：將HTML編碼
呼叫方法：
KW.x();
*/
(function () {
if (!window.KW) {
window.KW = {};
};
window.KW = {
version : "1.2",
$ : function () { //$()函式
var elements = new Array();
for (var i = 0; i <= arguments.length; i++) {
var element = arguments[i];
//如果是一個字串那假設它是一個ID
if (typeof element == 'string') {
element = document.getElementById(element);
}
//如果只提供了一個引數,則立即返回這個引數
if (arguments.length == 1) {
return element;
}
//否則，將它新增到陣列中
elements.push(element);
}
return elements;
},
/*-------------------- 事件處理 --------------------*/
addEvent : function (oTarget, oType, fnHandler) { //-----新增事件;
var oT = typeof oTarget == "string" ? this.$(oTarget) : oTarget;
if (!oT) {
alert('Not found \" ' + oTarget + ' \"');
return false
};
if (oT.addEventListener) { //for DOM
oT.addEventListener(oType, fnHandler, false);
} else if (oT.attachEvent) { //for IE
oT.attachEvent('on' + oType, fnHandler);
} else { //for Others
oT['on' + oType] = fnHandler;
}
},
removeEvent : function (oTarget, oType, fnHandler) { //-----移除事件;
var oT = this.$(oTarget);
if (!oT) {
alert('Not found \" ' + oTarget + ' \"');
return false
};
if (oT.removeEventListener) { //for DOM
oT.removeEventListener(oType, fnHandler, false);
} else if (oT.detachEvent) { //for IE
oT.detachEvent('on' + oType, fnHandler);
} else { //for Others
oT['on' + oType] = null;
}
},
getEvent : function (ev) { //-----獲得事件-----
return ev || window.event;
},
getTarget : function (ev) { //-----獲取目標----
return this.getEvent(ev).target || this.getEvent().srcElement;
},
stopPropagation : function () { //-----阻止冒泡-----
if (window.event) {
return this.getEvent().cancelBubble = true;
} else {
return arguments.callee.caller.arguments[0].stopPropagation();
}
},
stopDefault : function () { //-----阻止預設行為
if (window.event) {
return this.getEvent().returnValue = false;
} else {
return arguments.callee.caller.arguments[0].preventDefault();
}
},
/*-------------------- 常用函式 --------------------*/
toggleDisplay : function (id) { //-----顯示，隱藏-----
var oTarget = this.$(id);
if (!oTarget) {
return false;
}
oTarget.style.display == 'none' ? oTarget.style.display = 'block' : oTarget.style.display = 'none';
},
stripHTML : function (agr) { //-----移除HTML-----
var reTag = /<(?:.|\s)*?>/g;
return agr.replace(reTag, '')
},
stripSpace : function (oTarget) { //-----移除空格-----
var re = /^\s*(.*?)\s*$/;
return oTarget.replace(re, '$1');
},
isEmail : function (e) { //-----Is E-mail
var re = /^[a-zA-z_][a-zA-Z_0-9]*?@\w{1,}.\[a-zA-Z]{1,}/;
return re.test(e);
},
/*-------------------- Cookie操作 --------------------*/
setCookie : function (sName, sValue, oExpires, sPath, sDomain, bSecure) { //-----設定Cookie-----
var sCookie = sName + '=' + encodeURIComponent(sValue);
if (oExpires) {
var date = new Date();
date.setTime(date.getTime() + oExpires * 60 * 60 * 1000);
sCookie += '; expires=' + date.toUTCString();
}
if (sPath) {
sCookie += '; path=' + sPath;
}
if (sDomain) {
sCookie += '; domain=' + sDomain;
}
if (bSecure) {
sCookie += '; secure';
}
document.cookie = sCookie;
},
getCookie : function (sName) { //-----獲得Cookie值-----
var sRE = '(?:; )?' + sName + '=([^;]*)';
var oRE = new RegExp(sRE);
if (oRE.test(document.cookie)) {
return decodeURIComponent(RegExp['$1']);
} else {
return null;
}
},
deleteCookie : function (sName, sPath, sDomain) { //-----刪除Cookie值-----
this.setCookie(sName, '', new Date(0), sPath, sDomain);
},
clearCookie : function () { //清除所有Cookie
var cookies = document.cookie.split(";");
var len = cookies.length;
for (var i = 0; i < len; i++) {
var cookie = cookies[i];
var eqPos = cookie.indexOf("=");
var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
name = name.replace(/^\s*|\s*$/, "");
document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/"
}
},
convert : function (sValue, sDataType) { //型別轉，根據不同型別資料排序，比如，整型，日期，浮點，字串，接受兩個引數，一個是值，一個是排序的資料型別
switch (sDataType) {
case "int":
return parseInt(sValue);
case "float":
return parseFloat(sValue);
case "date":
return new Date(Date.parse(sValue));
default:
return sValue.toString();
}
},
geterateCompareTRs : function (iCol, sDataType) { //比較函式，用於sort排序用
return function compareTRs(oTR1, oTR2) {
var vValue1,
vValue2;
if (oTR1.cells[iCol].getAttribute("value")) { //用於高階排序，比如圖片，新增一個額外的屬性來排序
vValue1 = KW.convert(oTR1.cells[iCol].getAttribute("value"), sDataType);
vValue2 = KW.convert(oTR2.cells[iCol].getAttribute("value"), sDataType);
} else {
vValue1 = KW.convert(oTR1.cells[iCol].firstChild.nodeValue, sDataType);
vValue2 = KW.convert(oTR2.cells[iCol].firstChild.nodeValue, sDataType);
}
if (vValue1 < vValue2) {
return -1;
} else if (vValue1 > vValue2) {
return 1;
} else {
return 0;
}
}
},
tabSort : function (sTableID, iCol, sDataType) { //排序函式，sTableID為目標,iCol哪列排序，為必需，sDataType可選
var oTable = document.getElementById(sTableID);
var oTBody = oTable.tBodies[0];
var colDataRows = oTBody.rows;
var aTRs = [];
var len = colDataRows.length;
for (var i = 0; i < len; i++) {
aTRs[i] = colDataRows[i];
};
if (oTable.sortCol == iCol) { //如果已經排序，則倒序
aTRs.reverse();
} else {
aTRs.sort(this.geterateCompareTRs(iCol, sDataType));
}
var oFragment = document.createDocumentFragment();
var trlen = aTRs.length;
for (var j = 0; j < trlen; j++) {
oFragment.appendChild(aTRs[j]);
};
oTBody.appendChild(oFragment);
oTable.sortCol = iCol; //設定一個狀態
},
GetQueryString : function (name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null)
return unescape(r[2]);
return null;
},
HTMLEscape : function (str) {
var s = "";
if (str.length == 0) {
return "";
}
s = str.replace(/&/g, "&");
s = s.replace(/</g, "<");
s = s.replace(/>/g, ">");
s = s.replace(/ /g, " ");
s = s.replace(/\'/g, "'");
s = s.replace(/\"/g, """);
return s;
},
loadJS : function (url) {
var statu = true; //初始狀態
var js = document.getElementsByTagName("script");
var len = js.length;
for (var i = 0; i < len; i++) {
if (js[i].getAttribute("src") == url) {
statu = false; //如果已經新增，則設定為Flase，不再新增
}
}
if (statu) {
var script = document.createElement("script");
script.type = "text/javascript";
script.src = url;
var header = document.getElementsByTagName("head")[0];
header.appendChild(script);
}
},
ajax : function (obj) {
if (!obj.url) {
return false;
};
var method = obj.type || "GET";
var async = obj.async || true;
var dataType = obj.dataType;
var XHR = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
XHR.open(method, obj.url, async);
XHR.setRequestHeader('If-Modified-Since', 'Thu, 06 Apr 2006 00:00: 00 GMT');
XHR.send(null);
if (obj.sendBefore) {
obj.sendBefore();
};
XHR.onreadystatechange = function () {
if (XHR.readyState == 4 && (XHR.status >= 200 && XHR.status < 300 || XHR.status == 304)) {
if (obj.success) {
if (dataType && dataType.toLocaleLowerCase() === "json") {
obj.success(eval("(" + XHR.responseText + ")"))
} else if (dataType && dataType.toLocaleLowerCase() === "xml") {
obj.success(XHR.responseXML)
} else {
obj.success(XHR.responseText);
}
};
if (obj.complete) {
obj.complete()
}
} else {
if (obj.complete) {
obj.complete()
}
if (obj.error) {
obj.error("The XMLHttpRequest failed. status: " + XHR.status);
}
}
}
}
};
})();相關文章
- 前端常用函式封裝前端函式封裝
- 那些年我封裝的 JS 函式封裝JS函式
- 關於Vue中常用的工具函式封裝Vue函式封裝
- js封裝 Ajax ——常用工具函式JS封裝函式
- javascript封裝動畫函式（勻速、變速）JavaScript封裝動畫函式
- JavaScript - 獲取字串位元組數（函式封裝）JavaScript字串函式封裝
- javascript原生封裝一個淡入淡出效果的函式JavaScript封裝函式
- javascript常用函式大全JavaScript函式
- 封裝一個自己的js庫封裝JS
- 手寫JavaScript常用的函式JavaScript函式
- 自己封裝的一些業務小元件封裝元件
- 【封裝小技巧】列表處理函式的封裝封裝函式
- JSONP 通用函式封裝JSON函式封裝
- 【封裝小技巧】數字處理函式的封裝封裝函式
- 封裝帶引數的函式封裝函式
- 前端 javascript 練習題--Math、Data及函式封裝【千鋒】前端JavaScript函式封裝
- python怎麼封裝函式Python封裝函式
- JavaScript常用工具方法封裝（1）JavaScript封裝
- 總結一些常用的陣列函式陣列函式
- 我自己封裝的 Laravel 融雲 sdk,簡單好用封裝Laravel
- JavaScript 和 CSS 常用工具方法封裝JavaScriptCSS封裝
- 【JavaScript框架封裝】公共框架的封裝JavaScript框架封裝
- 原生JS 一定要學會自己封裝函式，不然還怎麼‘原生’？JS封裝函式
- oracle資料庫常用分析函式與聚合函式的用法Oracle資料庫函式
- hive常用的一些高階函式彙總Hive函式
- CSS 和 JavaScript 常用工具方法封裝教程！CSSJavaScript封裝
- 關於緩動動畫函式的封裝動畫函式封裝
- 封裝一個簡單的動畫函式封裝動畫函式
- JavaScript中一些常用的正規表示式(推薦)JavaScript
- 【JavaScript框架封裝】實現一個類似於JQuery的CSS樣式框架的封裝JavaScript框架封裝jQueryCSS
- JS盒子模型、圖片懶載入、DOM庫封裝 — 1、JS盒子模型及常用操作樣式方法的封裝...JS模型封裝
- 好程式設計師分享JavaScript事件委託代理和函式封裝詳解程式設計師JavaScript事件函式封裝
- 淺析jQuery原理並仿寫封裝一個自己的庫jQuery封裝
- 常用的一些javascript小技巧JavaScript
- 打造自己的JavaScript工具庫JavaScript
- 分享個自己封裝的限流trait封裝AI
- Mysql 常用函式（1）- 常用函式彙總MySql函式
- web前端常用的封裝方法Web前端封裝
- Java 位元組的常用封裝Java封裝