网站建设.龙兵,网页设计详细步骤,做电商网站的框架结构图,网站建设优化两千字V1.001更新增加findTable-min.js 本次更新#xff0c;优化了代码性能方面#xff0c;增加了部分新功能#xff0c;可以获取多个table表格批量操作。 考虑到本人后面的项目中可能涉及到大量的表格操作#xff0c;提前先封了 一个简单的操作方法#xff0c;日后再加完善优化了代码性能方面增加了部分新功能可以获取多个table表格批量操作。 考虑到本人后面的项目中可能涉及到大量的表格操作提前先封了 一个简单的操作方法日后再加完善但对于小页面需求是完全够 用的。该方法很强大。 f(elm,boolean).getTableXY(x,y,type) elm传入表格选择器 如果不传默认查找table标签 使用的是querySelector()和querySelectorAll()选择器 请注意兼容性。 boolean。选择取页面第一个还是取页面所有符合条件的table数组 默认为false查找页面第一个符合条件的元素。可选。 x表示第几行tr y表示第几列td type[“all” || “tr” || “td”] all获取精确地td对象第x行第y列 47‘all’ tr获取第x行整行tr。1‘tr’ 此处y参数可省略。 td获取第y列整列td。3‘td’ 此处x参数可省略 该方法返回原生DOM对象或原生DOM对象数组 下面给大家分享js源码。 0/***1 2表格操作插件 V1.0013表格操作插件 V1.0024 1.修复传参传入null的错误5 2.修复给每个td绑定传入错误应该循环数组6 3.给f()返回的数组绑定方法可以直接调用7 4.修复部分BUG8Mr.chen9 10***/11var f function(tab,flag){12 13 var findTable {},14 f findTable,15 tabArr [];16 17 if(tab true || tab true){18 19 tab table;20 21 flag true;22 23 }else{24 25 tab tab;26 27 }28 29 //判断是获取单个还是获取所有最后都要装进数组30 if(flag){31 32 f.table document.querySelectorAll(tab);33 34 for(var o 0; o f.table.length; o 1){35 36 tabArr.push(f.table[o]);37 38 }39 40 }else{41 42 tab tab || table;43 44 f.table document.querySelector(tab);45 46 f.table.length 1;47 48 tabArr.push(f.table);49 50 }51 52 for(var p 0; p tabArr.length; p 1){53 54 actionTable(tabArr[p]);55 56 }57 58 //给数组直接绑定方法59 f.table.getTableXY function(x,y,type){60 61 var tableAllArr [],62 temp parameter(x,y,type);63 64 x temp.x;65 66 y temp.y;67 68 type temp.type;69 70 71 if(tabArr.length 1){72 73 return actionTable(tabArr[0]).getTableXY(x,y,type);74 75 }else{76 77 for(var p 0; p tabArr.length; p 1){78 79 tableAllArr.push(actionTable(tabArr[p]).getTableXY(x,y,type));80 81 } 82 83 return tableAllArr;84 85 }86 87 }88 89 function actionTable(obj){90 91 var f obj;92 93 //获取当前table所有trtdth94 f.refreshTable function(){95 96 f.tableTr obj.querySelectorAll(tr);97 98 f.tableTd obj.querySelectorAll(td);99 100 f.tableTrLength f.tableTr.length;101 102 f.tableTdLength f.tableTd.length;103 104 };105 106 f.refreshTable();107 108 //给所有td绑定唯一标识109 f.tableCard function(){110 111 var i 0,k 0,112 everyTrChild,113 everyTrChildLength;114 115 //可能对table做出增删操作重新获取,116 f.refreshTable();117 118 for(i; i f.tableTrLength; i 1){119 120 //为每一个td绑定独立ID121 f.bindXY(f.tableTr[i],i);122 123 }124 125 };126 127 //为每一个td绑定独立ID128 f.tableTdArr [];129 130 f.bindXY function(tr,i){131 132 var td tr.querySelectorAll(td),133 tdLen td.length;134 135 for(var n 0; n tdLen; n 1){136 137 td[n].tableX i;138 139 td[n].tableY n;140 141 td[n].tableXY [i,n];142 143 f.tableTdArr.push(td[n]);144 145 }146 147 };148 149 f.tableCard();150 151 152 //获取元素方法153 f.getTableXY function(x,y,type){154 155 var temp parameter(x,y,type);156 157 x temp.x;158 159 y temp.y;160 161 type temp.type;162 163 //取出精确坐标164 if(type type all || (x y y ! all !type)){165 166 type all;167 168 return f.eachTable(x,y,type);169 170 }else{171 172 return f.eachTable(x,y);173 174 }175 176 };177 178 //循环比较找出符合条件的元素179 f.eachTable function(x,y,type){180 181 if(type type all){182 183 for(var i 0; i f.tableTdArr.length; i 1){184 185 186 if(x f.tableTdArr[i].tableXY[0] y f.tableTdArr[i].tableXY[1]){187 188 f.success f.tableTdArr[i];189 190 break;191 192 }193 194 }195 196 }197 198 if(y tr){199 200 for(var n 0; n f.tableTdArr.length; n 1){201 202 if(x f.tableTdArr[n].tableX){203 204 f.success f.tableTdArr[n].parentNode;205 206 break;207 208 }209 210 }211 212 }213 214 if(y td){215 216 f.success [];217 218 for(var m 0; m f.tableTrLength; m 1){219 220 var tbtr f.tableTr[m].querySelectorAll(td);221 222 //console.log(tbtr);223 224 for(k 0; k tbtr.length; k 1){225 226 if(x tbtr[k].tableY){227 228 f.success.push(tbtr[k]);229 230 continue;231 }232 233 }234 235 }236 237 }238 239 return f.success;240 241 };242 243 return f;244 245 }246 247 248 //参数处理249 function parameter(x,y,type){250 251 //避免出现 0 false252 if(x 0){253 254 x 0;255 256 }257 258 if(y 0){259 260 y 0;261 }262 263 if(y null type tr){264 265 y type;266 267 }268 269 if(x null type td){270 271 x y;272 273 y type;274 275 }276 277 return {278 x : x,279 y : y,280 type : type281 }282 283 }284 285 return f.table;286 287};288 289 js包下载地址 点击在线运行 欢迎大家补充一起探讨 查看原文-摘自大公爵ddamy.com转载于:https://www.cnblogs.com/webhb/p/5755741.html
