本文主要是介绍自己根据js的兼容封装了一个小小的js库,留着以后用.后期一点一点完善，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
1 var gys = function () { }
2 //oParent父节点
3 //获取所有的子元素
4 gys.prototype.getElementChildren = function (oParent) {
5 return oParent.children;
6 }
7 //arr获取的数组,jsonCss是修改属性css的json数据
8 // gys.setElementCss(aLi, {"color":"red","backgroundColor":"yellow","backgroundImage":"url(../img/test.jpg)"});
9 //设置元素的css
10 gys.prototype.setElementCss = function (arr, jsonCss) {
11 var length = arr.length;
12 if (length == 0) return; //没有元素
13 else if (!length) { //单个元素
14 for (var key in jsonCss) {
15 arr.style[key] = jsonCss[key];
16 }
17 }
18 else { //元素集合
19 for (var i = 0; i < arr.length; i ) {
20 for (var key in jsonCss) {
21 arr[i].style[key] = jsonCss[key];
22 }
23 }
24 }
25 }
26 //获取第一个子元素
27 gys.prototype.getElementFirstChildren = function (oParent) {
28 if (oParent.firstElementChild)//高版本浏览器,
29 {
30 return oParent.firstElementChild;
31 }
32 else //IE6,7,8
33 return oParent.firstChild;
34 }
35 //获取最后一个子元素
36 gys.prototype.getElementLastChildren = function (oParent) {
37 if (oParent.lastElementChild)//高版本浏览器,
38 {
39 return oParent.lastElementChild;
40 }
41 else //IE6,7,8
42 return oParent.lastChild;
43 }
44 //获取下一个元素
45 gys.prototype.getElementNext = function (element) {
46 if (element.nextElementSibling) { //高版本浏览器
47 return element.nextElementSibling;
48 }
49 else { //IE6,7,8
50 return element.nextSibling;
51 }
52 }
53 //获取上一个元素
54 gys.prototype.getElementPrev = function (element) {
55 if (element.previousElementSibling) {
56 return element.previousElementSibling
57 }
58 else {
59 return element.previousSibling;
60 }
61 }
62
63 //ajax
64 /*
65 gys.ajax({ type: "get", url: "gps.txt", success: function (data) {
66 alert("成功" data);
67 }, error: function (data) {
68 alert(data);
69 }
70 });
71 */
72 gys.prototype.ajax = function (json) {
73 //1.创建服务器
74 var oAjax = null;
75 if (window.XMLHttpRequest) {
76 oAjax = new XMLHttpRequest();
77 }
78 else { //IE6
79 oAjax = new ActiveXObject("Microsoft.XMLHTTP");
80 }
81 /*2.连接服务器
82 open(方法,文件名,异步传输);
83 */
84 //oAjax.open("GET", "gys.txt?=" new Date().getTime(), true); //这里的date是为了去除缓存
85 oAjax.open(json.type.toUpperCase(), json.url, true);
86 //3.发送请求
87 oAjax.send();
88 //4.接受返回
89 oAjax.onreadystatechange = function () {
90 /*
91 oAjax.readyState:浏览器和服务器交互经行到哪一步了
92 0:未初始化.还没有调用open()方法.
93 1:载入.已调用send()方法,正在发送请求
94 2:载入完成.send()方法完成,已收到全部响应内容,这个时候的数据是可能没法使用,因为这个数据是加密过的,也有可能是为了节省带宽,进行压缩过的.
95 3:解析.正在解析相应内容
96 4:完成.响应内容解析完成,可以在客户端调用了.
97 */
98 if (oAjax.readyState == 4) {//读取完成(并不代表成功)
99 if (oAjax.status == 200) { //成功
100 //alert("成功" oAjax.responseText);
101 json.success(oAjax.responseText);
102 }
103 else {
104 //alert("失败");
105 //json.error(oAjax.responseText);
106 if (json.error) {
107 json.error("错误:" oAjax.status);
108 }
109 }
110 }
111 }
112 }
113
114 //获取浏览器窗口位置
115 gys.prototype.getScreenPos = function () {
116 /*
117 IE,Safari,Opera,Chrome提供screenLeft和screenTop
118 Safari,Chrome,Firefox支持screenX和screenY(Opera对这个属性支持有差异)
119 */
120 var left = (typeof window.screenLeft == "number") ? window.screenLeft : window.screenX;
121 var top = (typeof window.screenTop == "number") ? window.screenTop : window.screenY;
122 return { left: left, top: top };
123 }
124 gys.prototype.addHandler = function (element, type, handler) {//注册事件
125 if (element.addEventListener) {//非IE
126 element.addEventListener(type, handler, false);
127 }
128 else if (element.attachEvent) {//IE
129 element.attachEvent("on" type, handler);
130 }
131 else {//dom0级
132 element["on" type] = handler;
133 }
134 }
135 gys.prototype.removeHandler = function (element, type, handler) { //取消注册事件
136 if (element.removeEventListener) {//非IE
137 element.removeEventListener(type, handler, false);
138 }
139 else if (element.detachEvent) {//IE
140 element.detachEvent("on" type, handler);
141 }
142 else {//dom0级
143 element["on" type] = null;
144 }
145 }
146 gys.prototype.getEvent=function (event) {//返回event的引用
147 return event ? event : window.event;
148 }
149 gys.prototype.getTarget=function (event) {//返回鼠标单击的目标对象
150 return event.target || event.srcElement;
151 }
152 gys.prototype.preventDefault=function (event) {//取消默认事件(a的href,radio,checkbox,)
153 if (event.preventDefault) {
154 event.preventDefault();
155 }
156 else {
157 event.returnValue = false;
158 }
159 }
160 gys.prototype.stopPropagation= function (event) {//因为这个EventUtil只支持冒泡,不支持事件捕获,所以这个方法只能阻止冒泡
161 if (event.stopPrapagation) {
162 event.stopPropagation();
163 }
164 else {
165 event.cancelBubble = true;
166 }
167 }
168 gys.prototype.getRelatedTarget=function (event) {//获取相关元素
169 /*
170 页面中有一个div;当鼠标离开这个div时,事件的主目标是div,而相关元素是body.
171 mouseover:事件的主目标是获得光标的元素,而相关元素就是那个失去光标的元素.
172 mouseout:事件的主目标是失去光标的元素,而相关元素使获得光标的那个元素.
173 */
174 if (event.relatedTarget) { return event.relatedTarget; }
175 else if (event.toElement) { return event.toElement; }
176 else if (event.fromElement) { return event.fromElement; }
177 else { return null; }
178 }
179 gys.prototype.getButton= function (event) {//获取鼠标按钮的点击方式
180 if (document.implementation.hasFeature("MouseEvents", "2.0")) { return event.button; }
181 else {
182 switch (event.button) {
183 case 0:
184 case 1:
185 case 3:
186 case 5:
187 case 7:
188 return 0; //左击
189 case 2:
190 case 6:
191 return 2; //中间键
192 case 4:
193 return 1; //右击
194 }
195 }
196 }
197 gys = new gys();
这篇关于自己根据js的兼容封装了一个小小的js库,留着以后用.后期一点一点完善的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
