常用js代码整理、收集
个人整理了一下个人常用到的一些js代码,以方便学习以及日后使用,或许有一些是个人之前从网上摘下来的,但是不记得是具体从哪里来的了,如果你看到有一段代码跟你的文章很相似甚至一样,请不要气愤,请告诉我,我必定加上版权链接。
清除输入框默然提示文字
1 <input type="text" name="word" value='请输入关键字' style="color:#ccc;" /> 2 <script> 3 /* 4 *清除输入框默然提示文字 5 */ 6 jQuery.focusblur = function(focusid,focusColor,blurColor) { 7 var focusblurid = $(focusid); 8 var defval = focusblurid.val(); 9 focusblurid.focus(function(){ 10 var thisval = $(this).val(); 11 if(thisval==defval){ 12 $(this).val(""); 13 $(this).css("color",focusColor); 14 } 15 }); 16 focusblurid.blur(function(){ 17 var thisval = $(this).val(); 18 if(thisval==""){ 19 $(this).val(defval); 20 $(this).css("color",blurColor); 21 }else{ 22 $(this).css("color",focusColor); 23 } 24 }); 25 26 }; 27 28 $(document).ready(function(){ 29 //清除name='world'的input里的默认提示文字 30 $.focusblur("[name='word']","#333","#ccc"); 31 32 }) 33 </script>
返回顶部
1 <!-- 返回顶部 --> 2 <style> 3 #gotop{display:none; width:80px; height:30px; line-height:30px; text-align:center; border:1px solid #dedede; background-color:#f8f8f8; cursor:pointer; 4 position:fixed; bottom:40px; right:20px; z-index:99999; 5 } 6 </style> 7 <div id="gotop">gotop</div> 8 <script type='text/javascript'> 9 var backTop=function (btnId){ 10 var btn=document.getElementById(btnId); 11 var d=document.documentElement; 12 var b=document.body; 13 window.onscroll=set; 14 btn.onclick=function (){ 15 btn.style.display="none"; 16 window.onscroll=null; 17 this.timer=setInterval(function(){ 18 d.scrollTop-=Math.ceil((d.scrollTop+b.scrollTop)*0.1); 19 b.scrollTop-=Math.ceil((d.scrollTop+b.scrollTop)*0.1); 20 if((d.scrollTop+b.scrollTop)==0) clearInterval(btn.timer,window.onscroll=set); 21 },10); 22 }; 23 function set(){btn.style.display=(d.scrollTop+b.scrollTop>800)?'block':"none"} //滚动的高度大于800px时才显示 24 }; 25 backTop('gotop'); 26 </script> 27 <!-- 返回顶部END -->
去除数组里的重复项
1 /* 2 *去除数组里的重复项 3 */ 4 function uniQueue(array){ 5 var arr=[]; 6 var m; 7 while(array.length>0){ 8 m=array[0]; 9 arr.push(m); 10 array=$.grep(array,function(n,i){ 11 return n==m; 12 },true); 13 } 14 return arr; 15 } 16 var testArr=[3,3,2,1,5,5]; 17 alert(testArr); //[3,3,2,1,5,5] 18 alert(uniQueue(testArr)); //[3,2,1,5]
上一个要用到jquery,要引入jquery或许太麻烦了点,于是乎弄了个原生态js的
1 //去除数组里的重复项(纯javascript实现) 2 function uniQueue(arr){ 3 if(!(arr instanceof Array)) return false; 4 for(var i=0; i<arr.length; i++){ 5 for(var j=i+1; j<arr.length; j++){ 6 if(arr[i]==arr[j]) arr.splice(j,1); 7 } 8 } 9 return arr; 10 } 11 12 var arr=["a","b","a","c","c"]; 13 uniQueue(arr); //arr=["a","b","c"]
为了方便使用,直接把它封装成Array的prototype原型对象函数
1 //封装成Array对象的prototype原型对象函数(去除数组里的重复项) 2 Array.prototype.uniQueue=function(){ 3 for(var i=0; i<this.length; i++){ 4 for(var j=i+1; j<this.length; j++){ 5 if(this[i]==this[j]) this.splice(j,1); 6 } 7 } 8 return this; 9 10 } 11 12 var arr=["a","b","a","c","c"]; 13 arr.uniQueue(); //arr=["a","b","c"]
有时候或许需要这样子的要求:出现重复的时候,去除前面的,保留后面的,如要把["a","b","a","c","c"]去除重复项后要求变成这样子["b","a","c"]而不是["a","b","c"]。对之前的代码稍作修改即可:
1 function uniQueue(arr){ 2 if(!(arr instanceof Array)) return false; 3 for(var i=0; i<arr.length; i++){ 4 for(var j=i+1; j<arr.length; j++){ 5 if(arr[i]==arr[j]) arr.splice(i,1); //删除出现相同元素中下标小的,即前者 6 } 7 } 8 return arr; 9 } 10 11 var arr=["a","b","a","c","c"]; 12 uniQueue(arr); //此时arr=["b","a","c"],而不是//arr=["a","b","c"]
冒泡排序
1 /* 2 * 冒泡排序 3 */ 4 function bubbleSort(arg){ 5 return bubbleSortTemp(arg.arr, 6 arg.order || "asc"); 7 } 8 function bubbleSortTemp(arr,order){ 9 if(!(arr instanceof Array)) return false; 10 if(order=="asc"){ //asc:升序 11 for(var i=0;i<arr.length;i++){ 12 for(var j=i+1;j<arr.length;j++){ 13 if(arr[i]>arr[j]){ 14 var temp=arr[i]; 15 arr[i]=arr[j]; 16 arr[j]=temp; 17 } 18 } 19 } 20 return arr; 21 }else if(order=="desc"){ //desc:降序 22 for(var i=0;i<arr.length;i++){ 23 for(var j=i+1;j<arr.length;j++){ 24 if(arr[i]<arr[j]){ 25 var temp=arr[i]; 26 arr[i]=arr[j]; 27 arr[j]=temp; 28 } 29 } 30 } 31 return arr; 32 }else{ 33 return false; 34 } 35 } 36 //具体例子如下 37 var testArr=[2,4,5,1,3,6,8,7]; 38 alert(testArr); //[2,4,5,1,3,6,8,7] 39 alert(bubbleSort({arr:testArr,order:"desc"})); //[8,7,6,5,4,3,2,1] 40 alert(bubbleSort({arr:testArr,order:"asc"})); //[1,2,3,4,5,6,7,8] 41 alert(bubbleSort({arr:testArr})); //[1,2,3,4,5,6,7,8]
把冒泡排序封装成prototype原型对象函数
1 /* 2 *把冒泡排序封装成prototype原型对象函数 3 */ 4 Array.prototype.asc=function(){ //升序排序 5 for(var i=0;i<this.length;i++){ 6 for(var j=i+1;j<this.length;j++){ 7 if(this[i]>this[j]){ 8 var temp=this[i]; 9 this[i]=this[j]; 10 this[j]=temp; 11 } 12 } 13 } 14 return this; 15 } 16 Array.prototype.desc=function(){//降序排序 17 for(var i=0;i<this.length;i++){ 18 for(var j=i+1;j<this.length;j++){ 19 if(this[i]<this[j]){ 20 var temp=this[i]; 21 this[i]=this[j]; 22 this[j]=temp; 23 } 24 } 25 } 26 return this; 27 } 28 //具体例子如下 29 var testArr=[2,4,5,1,3,6,8,7]; 30 alert(testArr.asc()); //[1,2,3,4,5,6,7,8] 31 alert(testArr.desc()); //[8,7,6,5,4,3,2,1]
让ie支持getElementsByClassName方法
1 if (navigator.appName == 'Microsoft Internet Explorer') { //让ie支持getElementsByClassName方法 2 document.getElementsByClassName = function() { 3 var tTagName = "*"; 4 if (arguments.length > 1) { 5 tTagName = arguments[1]; 6 } 7 if (arguments.length > 2) { 8 var pObj = arguments[2] 9 } else { 10 var pObj = document; 11 } 12 var objArr = pObj.getElementsByTagName(tTagName); 13 var tRObj = new Array(); 14 for ( var i = 0; i < objArr.length; i++) { 15 if (objArr[i].className == arguments[0]) { 16 tRObj.push(objArr[i]); 17 } 18 } 19 return tRObj; 20 } 21 }