常见的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';
                         }
                    }
               }
          }