Fork me on GitHub

常见的js函数

改变元素的样式
 
var  changeStyle = function(elem,name,value){
     elem.style[name] = value;
}
 
空位补零
 
function  toDouble(num)
{
     if(num<10)
     {
          return  "0"+num;
     }    
     else
     {
          return  ""+num;
     }
}
 
 
将getDay()变得正常点
 
function toChinese(day)
     {
          switch(day)
          {
               case 0: return '周日';
               case 1: return '周一';
               case 2: return '周二';
               case 3: return '周三';
               case 4: return '周四';
               case 5: return '周五';
               case 6: return '周六';
          }
     }
 
一般使用时:var oDate = new Date();     var   str = toChinese(oDate.getDay());
 
typeof的应用~~~查看变量的类型   (这个实例是仿jquery的工作原理的原生js--------严重缩水版的vQuery选择器)   
  
由typeof检查的常用类型有:number   string    boolean   function    object    undefined
 
   <script>
   function $(vArg)
     {
          if(typeof vArg == 'function')
              { 
                   window.onload = vArg;    
              }
          else if(typeof vArg == 'string')
             { 
                   return  document.getElementById(vArg);
             }
           else if(typeof vArg == 'object')
             {
                     return vArg;
            }
     }
 
$(function(){
          $('div1').onclick = function(){
               $(this).style.background = 'red';
          };
     })
     </script>
 
//而下面这段就是jquery的源码
 /*$(function(){
          $('#div1').click(function(){
               $(this).css('background','red');
          })
     })*/
 
 
arr.sort,因为sort方法--------默认的,将所有的东西都是作为字符串处理来进行排序
 
当你要排序的是“数字”时,给它一个参数
 
var arr = [12,34,2,19,78];
 
arr.sort(function(num1,num2){
          if(num1<num2)
          {
               return -1;             //第一个比第二个靠左
          }
          else if(num1>num2)             //右
          {
               return 1;
          }
          else                    //一样
          {
               return 0 ;
          }
         
     });

 alert(arr);
 
 
 
var arr = [12,34,2,19,78];
 
arr.sort(function(num1,num2){
          return  num1-num2;
     });

 alert(arr);
 
 
如果要排序的是中文字
 
var arr = ['张三','李四','王五','流星'];
    
     arr.sort(function(str1,str2){
          return  str1.localeCompare(str2);
     });
    
     alert(arr);
 
 
5、toString的用法
 
function  show()
{
          alert('a');
 }
show.toString = function()
{
          return '就不让你弹出来';
 }
alert(show);
 
当你不加show.toString这个,会弹出show这个函数的源代码~而加入toString,实际是重用了这个方法
 
而这边toString只有数字在用的,才能带参数,如下:
 
var num=255;
alert('#'+ num.toString(16));     这是变成16进制的,也可以变成任意进制的(将会用在颜色渐变的上)
 
 
找一个数组里面是否有一个数字
 
function  hasContain(arr,num)
{
     var i =0;

     for(i=0;i<arr.length;i++)
     {
          if(arr[i]==num)
          { 
               return  true;
          }
     }
     return false;
}
 
 
绑定事件的函数(解决attachEvent和addEventListener兼容性问题的方案
 
if(oBtn.attachEvent)
          {
               oBtn.attachEvent('onclick',aaa);
               oBtn.attachEvent('onclick',bbb);
          }
 else
          {
               oBtn.addEventListener('click',aaa,false);
               oBtn.addEventListener('click',bbb,false);
          }
 
改为

function  myAddEvent(obj,sEvent,fn)             //绑定事件
     {
          if(obj.attachEvent)
          {
               obj.attachEvent('on'+ sEvent,fn);
          }
          else
          {
               obj.addEventListener(sEvent,fn,false);
          }
     }
 
     myAddEvent(oBtn,'click',aaa);
     myAddEvent(oBtn,'click',bbb);
 
 
点击页面的标签,弹出标签的名称
 
html:
     <div id="div"><span>SPAN</span>DIV</div>
     <span>SPAN</span>
     <p>P</p>
 
css:
div{ background:#0000FF;width:100px;height:100px;}
span{ background:#00FF00;width:100px;height:100px;}
p{ background:#FF0000;width:100px;height:100px;}
 
js:
document.onclick = function(evt){
     var  e = window.event ||   evt;
     var  tag = e["target"] || e["srcElement"];       //这一句一般都会写成这样      var  tag = e.target || e.srcElement;
     alert(tag.tagName);
}     
 
ie用e.srcElement,ff用e.target(都是表示被点击的对象)
 
而evt是什么呢?先说说原因,window.event 只能在IE上运行,而不能在火狐中实现,这是因为火狐的event只能在事件发生的现场使用。
而这个问题的解决方案:在事件发生的函数上加上event参数,在函数体内(假设形参为evt)使用 。
 
js对table的偶数行划过变色(其中有遍历table)
 
window.onload = function(){
             var oTable = document.getElementById('tb');
             for(var i=0; i<oTable.rows.length; i++)
             {  
                    if(i%2==0)
                    {
                         oTable.rows[i].onmouseover = function()
                         {
                              this.style.backgroundColor  = '#ffff66';
                         }
                         oTable.rows[i].onmouseout = function()
                         {
                              this.style.backgroundColor = '#d4e3e5';
                         }
                    }
               }
          }
posted on 2014-03-10 10:29  雨为我停  阅读(349)  评论(0编辑  收藏  举报