首页 > 代码库 > JS基础知识

JS基础知识

javascript的数组

Js代码  

//定义数组   

        var pageIds = new Array();   

        pageIds.push(‘A‘);   

  

        数组长度   

        pageIds.length;   

  

//shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined    

var a = [1,2,3,4,5];    

var b = a.shift(); //a[2,3,4,5]   b1    

  

//unshift:将参数添加到原数组开头,并返回数组的长度    

var a = [1,2,3,4,5];    

var b = a.unshift(-2,-1); //a[-2,-1,1,2,3,4,5]   b7    

//注:在IE6.0下测试返回值总为undefinedFF2.0下测试返回值为7,所以这个方法的返回值不可靠,需要用返回值时可用splice代替本方法来使用。    

  

//pop:删除原数组最后一项,并返回删除元素的值;如果数组为空则返回undefined    

var a = [1,2,3,4,5];    

var b = a.pop(); //a[1,2,3,4]   b5    

  

//push:将参数添加到原数组末尾,并返回数组的长度    

var a = [1,2,3,4,5];    

var b = a.push(6,7); //a[1,2,3,4,5,6,7]   b7    

  

//concat:返回一个新数组,是将参数添加到原数组中构成的    

var a = [1,2,3,4,5];    

var b = a.concat(6,7); //a[1,2,3,4,5]   b[1,2,3,4,5,6,7]    

  

//splice(start,deleteCount,val1,val2,):从start位置开始删除deleteCount项,并从该位置起插入val1,val2,    

var a = [1,2,3,4,5];    

var b = a.splice(2,2,7,8,9); //a[1,2,7,8,9,5]   b[3,4]    

var b = a.splice(0,1); //shift    

a.splice(0,0,-2,-1); var b = a.length; //unshift    

var b = a.splice(a.length-1,1); //pop    

a.splice(a.length,0,6,7); var b = a.length; //push    

  

//reverse:将数组反序    

var a = [1,2,3,4,5];    

var b = a.reverse(); //a[5,4,3,2,1]   b[5,4,3,2,1]    

  

//sort(orderfunction):按指定的参数对数组进行排序    

var a = [1,2,3,4,5];    

var b = a.sort(); //a[1,2,3,4,5]   b[1,2,3,4,5]    

  

//slice(start,end):返回从原数组中指定开始下标到结束下标之间的项组成的新数组    

var a = [1,2,3,4,5];    

var b = a.slice(2,5); //a[1,2,3,4,5]   b[3,4,5]    

  

//join(separator):将数组的元素组起一个字符串,以separator为分隔符,省略的话则用默认用逗号为分隔符    

var a = [1,2,3,4,5];    

var b = a.join("|"); //a[1,2,3,4,5]   b"1|2|3|4|5"   

 

2.dom最常用API

Js代码  

document方法:    

getElementById(id) Node 返回指定结点的引用    

getElementsByTagName(name) NodeList 返回文档中所有匹配的元素的集合    

createElement(name) Node Node    

createTextNode(text) Node 创建一个纯文本结点    

ownerDocument Document 指向这个节点所属的文档    

documentElement Node 返回html节点    

document.body Node 返回body节点    

  

element方法:    

getAttribute(attributeName) String 返回指定属性的值    

setAttribute(attributeName,value) String 给属性赋值    

removeAttribute(attributeName) String 移除指定属性和它的值    

getElementsByTagName(name) NodeList 返回结点内所有匹配的元素的集合    

  

node方法:    

appendChild(child) Node 给指定结点添加一个新的子结点    

removeChild(child) Node 移除指定结点的子结点    

replaceChild(newChild,oldChild) Node 替换指定结点的子结点    

insertBefore(newChild,refChild) Node 在同一层级的结点前面插入新结点    

hasChildNodes() Boolean 如果结点有子结点则返回true    

  

node属性:    

nodeName String 以字符串的格式存放结点的名称    

nodeType String 以整型数据格式存放结点的类型    

nodeValue String 以可用的格式存放结点的值    

parentNode Node 指向结点的父结点的引用    

childNodes NodeList 指向子结点的引用的集合    

firstChild Node 指向子结点结合中的第一个子结点的引用    

lastChild Node 指向子结点结合中的最后一个子结点的引用    

previousSibling Node 指向前一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null    

nextSibling Node 指向后一个兄弟节点;如果这个节点就是兄弟节点,那么该值为null   

 

3.网上搜藏的一个map对象:

Js代码  

function HashMap()      

 {      

     /** Map 大小 **/     

     var size = 0;      

     /** 对象 **/     

     var entry = new Object();      

           

     /** 存 **/     

     this.put = function (key , value)      

     {      

         if(!this.containsKey(key))      

         {      

             size ++ ;      

         }      

         entry[key] = value;      

     }      

           

     /** 取 **/     

     this.get = function (key)      

     {      

         return this.containsKey(key) ? entry[key] : null;      

     }      

           

     /** 删除 **/     

     this.remove = function ( key )      

     {      

         if( this.containsKey(key) && ( delete entry[key] ) )      

         {      

             size --;      

         }      

     }      

           

     /** 是否包含 Key **/     

     this.containsKey = function ( key )      

     {      

         return (key in entry);      

     }      

           

     /** 是否包含 Value **/     

     this.containsValue = function ( value )      

     {      

         for(var prop in entry)      

         {      

             if(entry[prop] == value)      

             {      

                 return true;      

             }      

         }      

         return false;      

     }      

           

     /** 所有 Value **/     

     this.values = function ()      

     {      

         var values = new Array();      

         for(var prop in entry)      

         {      

             values.push(entry[prop]);      

         }      

         return values;      

     }      

           

     /** 所有 Key **/     

     this.keys = function ()      

     {      

         var keys = new Array();      

         for(var prop in entry)      

         {      

             keys.push(prop);      

         }      

         return keys;      

     }      

           

     /** Map Size **/     

     this.size = function ()      

     {      

         return size;      

     }      

           

     /* 清空 */     

     this.clear = function ()      

     {      

         size = 0;      

         entry = new Object();      

     }      

 }      

       

 var map = new HashMap();      

       

 /*    

 map.put("A","1");    

 map.put("B","2");    

 map.put("A","5");    

 map.put("C","3");    

 map.put("A","4");    

 */     

 /*    

 alert(map.containsKey("XX"));    

 alert(map.size());    

 alert(map.get("A"));    

 alert(map.get("XX"));    

 map.remove("A");    

 alert(map.size());    

 alert(map.get("A"));    

 */     

       

 /** 同时也可以把对象作为 Key **/     

 /*    

 var arrayKey = new Array("1","2","3","4");    

 var arrayValue = new Array("A","B","C","D");    

 map.put(arrayKey,arrayValue);    

 var value = map.get(arrayKey);    

 for(var i = 0 ; i < value.length ; i++)    

 {    

     //alert(value[i]);    

 }    

 */     

 /** 把对象做为Key时 ,自动调用了该对象的 toString() 方法 其实最终还是以String对象为Key**/     

       

 /** 如果是自定义对象 那自己得重写 toString() 方法 否则 就是下面的结果 **/     

       

 function MyObject(name)      

 {      

     this.name = name;      

 }      

       

 /**    

 function MyObject(name)    

 {    

     this.name = name;    

         

     this.toString = function ()    

     {    

         return this.name;    

     }    

 }    

 **/     

 var object1 = new MyObject("小张");      

 var object2 = new MyObject("小名");      

       

 map.put(object1,"小张");      

 map.put(object2,"小名");      

 alert(map.get(object1));      

 alert(map.get(object2));      

 map.remove("xxxxx");      

 alert(map.size());      

       

 /** 运行结果 小名 小名 size = 1 **/     

       

 /** 如果改成复写toString()方法的对象 效果就完全不一样了 **/     

       

 </script>    

 

4.常用的数字函数:

Js代码  

·数字型(Number)    

  1.声明    

    var i = 1;    

    var i = new Number(1);    

  

  2.字符串与数字间的转换    

    var i = 1;    

    var str = i.toString();     //结果: "1"    

    var str = new String(i);    //结果: "1"    

    i = parseInt(str);          //结果: 1    

    i = parseFloat(str);        //结果: 1.0    

       

    //注意: parseInt,parseFloat会把一个类似于"32G"的字符串,强制转换成32    

  

  3.判断是否为有效的数字    

    var i = 123;  var str = "string";    

    if( typeof i == "number" ){ }   //true    

       

    //某些方法(:parseInt,parseFloat)会返回一个特殊的值NaN(Not a Number)    

    //请注意第2点中的[注意],此方法不完全适合判断一个字符串是否是数字型!!    

    i = parseInt(str);    

    if( isNaN(i) ){ }    

       

  4.数字型比较    

    //此知识与[字符串比较]相同    

  

  5.小数转整数    

    var f = 1.5;    

    var i = Math.round(f);  //结果:2 (四舍五入)    

    var i = Math.ceil(f);   //结果:2 (返回大于f的最小整数)    

    var i = Math.floor(f);  //结果:1 (返回小于f的最大整数)    

  

  6.格式化显示数字    

    var i = 3.14159;    

       

    //格式化为两位小数的浮点数    

    var str = i.toFixed(2);     //结果: "3.14"    

       

    //格式化为五位数字的浮点数(从左到右五位数字,不够补零)    

    var str = i.toPrecision(5); //结果: "3.1415"    

  

  7.X进制数字的转换    

    //不是很懂 -.-    

    var i = parseInt("0x1f",16);    

    var i = parseInt(i,10);    

    var i = parseInt("11010011",2);    

  

  8.随机数    

    //返回0-1之间的任意小数    

    var rnd = Math.random();    

    //返回0-n之间的任意整数(不包括n)       

    var rnd = Math.floor(Math.random() * n)   

 

5.网上搜藏的js堆栈:

Js代码  

function stack(){   

      if(this.top==undefined){   

      //初始化堆栈的顶部指针和数据存放域   

            this.top=0;   

            this.unit=new Array();   

      }   

      this.push=function(pushvalue){   

      //定义压入堆栈的方法               

            this.unit[this.top]=pushvalue;   

            this.top+=1;               

      }   

      this.readAllElements=function(){   

      //定义读取所有数据的方法   

            if(this.top==0){   

                  alert("当前栈空,无法读取数据");   

                  return("");   

            }   

            var count=0;   

            var outStr="";   

                           

            for(count=0;count<this.top;count++){   

                  outStr+=this.unit[count]+",";   

            }               

            return(outStr);   

      }   

      this.pop=function(){   

      //定义弹出堆栈的方法   

            if(this.top==0){   

                  alert("当前栈空,无法弹出数据");   

                  return("");   

            }   

            var      popTo=this.unit[this.top-1];   

            this.top--;   

            return(popTo);   

            /* 从堆栈弹出数据,顶部指针减一,不过这里没有做到资源的释放,也  

            就是说数据仍然存在于this.unit的数组中,只不过无法访问罢了。目前  

            我也没想到好的办法解决。*/  

      }   

}  

 

6.最常用的JavaScript日期函数:

Js代码  

·日期型(Date)    

  1.声明    

    var myDate = new Date();    //系统当前时间     

    var myDate = new Date(yyyy, mm, dd, hh, mm, ss);    

    var myDate = new Date(yyyy, mm, dd);    

    var myDate = new Date("monthName dd, yyyy hh:mm:ss");    

    var myDate = new Date("monthName dd, yyyy");    

    var myDate = new Date(epochMilliseconds);    

  

  2.获取时间的某部份    

    var myDate = new Date();    

    myDate.getYear();       //获取当前年份(2)    

    myDate.getFullYear();   //获取完整的年份(4,1970-????)    

    myDate.getMonth();      //获取当前月份(0-11,0代表1)    

    myDate.getDate();       //获取当前日(1-31)    

    myDate.getDay();        //获取当前星期X(0-6,0代表星期天)      

    myDate.getTime();       //获取当前时间(1970.1.1开始的毫秒数)   时间戳!!   

    myDate.getHours();      //获取当前小时数(0-23)    

    myDate.getMinutes();    //获取当前分钟数(0-59)    

    myDate.getSeconds();    //获取当前秒数(0-59)    

    myDate.getMilliseconds();   //获取当前毫秒数(0-999)    

    myDate.toLocaleDateString();    //获取当前日期    

    myDate.toLocaleTimeString();    //获取当前时间    

    myDate.toLocaleString( );       //获取日期与时间    

  

  3.计算之前或未来的时间    

    var myDate = new Date();    

    myDate.setDate(myDate.getDate() + 10);  //当前时间加10天    

    //类似的方法都基本相同,set开头,具体参考第2点    

  

  4.计算两个日期的偏移量    

    var i = daysBetween(beginDate,endDate); //返回天数    

    var i = beginDate.getTimezoneOffset(endDate); //返回分钟数    

  

  5.检查有效日期    

    //checkDate() 只允许"mm-dd-yyyy""mm/dd/yyyy"两种格式的日期    

    if( checkDate("2006-01-01") ){ }    

       

    //正则表达式(自己写的检查 yyyy-mm-dd, yy-mm-dd, yyyy/mm/dd, yy/mm/dd 四种)    

    var r = /^(\d{2}|\d{4})[\/-]\d{1,2}[\/-]\d{1,2}$/;    

    if( r.test( myString ) ){ }   

 

 

7.最常用字符串函数API:

Js代码  

·字符串(String)    

  1.声明    

    var myString = new String("Every good boy does fine.");    

    var myString = "Every good boy does fine.";    

  

  2.字符串连接    

    var myString = "Every " + "good boy " + "does fine.";    

    var myString = "Every ";  myString += "good boy does fine.";    

  

  3.截取字符串    

    //截取第 位开始的字符    

    var myString = "Every good boy does fine.";    

    var section = myString.substring(6);    //结果: "good boy does fine."    

       

    //截取第 位开始至第 10 位为止的字符    

    var myString = "Every good boy does fine.";    

    var section = myString.substring(0,10); //结果: "Every good"    

       

    //截取从第 11 位到倒数第 位为止的字符    

    var myString = "Every good boy does fine.";    

    var section = myString.slice(11,-6);    //结果: "boy does"    

       

    //从第 位开始截取长度为 的字符    

    var myString = "Every good boy does fine.";    

    var section = myString.substr(6,4);     //结果: "good"    

  

  4.转换大小写    

    var myString = "Hello";    

    var lcString = myString.toLowerCase();  //结果: "hello"    

    var ucString = myString.toUpperCase();  //结果: "HELLO"    

  

  5.字符串比较    

    var aString = "Hello!";    

    var bString = new String("Hello!");    

    if( aString == "Hello!" ){ }    //结果: true    

    if( aString == bString ){ }     //结果: true    

    if( aString === bString ){ }    //结果: false (两个对象不同,尽管它们的值相同)    

  

  6.检索字符串    

    var myString = "hello everybody.";    

    // 如果检索不到会返回-1,检索到的话返回在该串中的起始位置    

    if( myString.indexOf("every") > -1 ){ } //结果: true    

  

  7.查找替换字符串    

    var myString = "I is your father.";    

    var result = myString.replace("is","am");   //结果: "I am your father."    

  

  8.特殊字符:    

    \b : 后退符         \t : 水平制表符    

    \n : 换行符         \v : 垂直制表符    

    \f : 分页符         \r : 回车符    

    \" : 双引号         \‘ : 单引号    

    \\ : 反斜杆    

  

  9.将字符转换成Unicode编码    

    var myString = "hello";    

    var code = myString.charCodeAt(3);  //返回"l"Unicode编码(整型)    

    var char = String.fromCharCode(66); //返回Unicode66的字符    

  

  10.将字符串转换成URL编码    

    var myString = "hello all";    

    var code = encodeURI(myString);     //结果: "hello%20all"    

    var str = decodeURI(code);          //结果: "hello all"    

    //相应的还有:  encodeURIComponent()  decodeURIComponent()   

 

8.数学函数:

Js代码  

·Math对象    

  1. Math.abs(num) : 返回num的绝对值    

  2. Math.acos(num) : 返回num的反余弦值    

  3. Math.asin(num) : 返回num的反正弦值    

  4. Math.atan(num) : 返回num的反正切值    

  5. Math.atan2(y,x) : 返回y除以x的商的反正切值    

  6. Math.ceil(num) : 返回大于num的最小整数    

  7. Math.cos(num) : 返回num的余弦值    

  8. Math.exp(x) : 返回以自然数为底,x次幂的数    

  9. Math.floor(num) : 返回小于num的最大整数    

  10.Math.log(num) : 返回num的自然对数    

  11.Math.max(num1,num2) : 返回num1num2中较大的一个    

  12.Math.min(num1,num2) : 返回num1num2中较小的一个    

  13.Math.pow(x,y) : 返回xy次方的值    

  14.Math.random() : 返回01之间的一个随机数    

  15.Math.round(num) : 返回num四舍五入后的值    

  16.Math.sin(num) : 返回num的正弦值    

  17.Math.sqrt(num) : 返回num的平方根    

  18.Math.tan(num) : 返回num的正切值    

  19.Math.E : 自然数(2.718281828459045)    

  20.Math.LN2 : 2的自然对数(0.6931471805599453)    

  21.Math.LN10 : 10的自然对数(2.302585092994046)    

  22.Math.LOG2E : log 2 为底的自然数(1.4426950408889634)    

  23.Math.LOG10E : log 10 为底的自然数(0.4342944819032518)    

  24.Math.PI : π(3.141592653589793)    

  25.Math.SQRT1_2 : 1/2的平方根(0.7071067811865476)    

  26.Math.SQRT2 : 2的平方根(1.4142135623730951)   

 

9.浏览器特征函数:

Js代码  

1.浏览器名称    

   //IE : "Microsoft Internet Explorer"    

   //NS : "Netscape"    

   var browserName = navigator.appName;    

  

 2.浏览器版本    

   var browserVersion = navigator.appVersion;    

  

 3.客户端操作系统    

   var isWin = ( navigator.userAgent.indexOf("Win") != -1 );    

   var isMac = ( navigator.userAgent.indexOf("Mac") != -1 );    

   var isUnix = ( navigator.userAgent.indexOf("X11") != -1 );    

  

 4.判断是否支持某对象,方法,属性    

   //当一个对象,方法,属性未定义时会返回undefinednull,这些特殊值都是false    

   if( document.images ){ }    

   if( document.getElementById ){ }    

  

 5.检查浏览器当前语言    

   if( navigator.userLanguage ){ var l = navigator.userLanguage.toUpperCase(); }    

  

 6.检查浏览器是否支持Cookies    

   if( navigator.cookieEnabled ){ }   

 

10.JavaScript面向对象的方法实现继承:call方法

Js代码  

// 动物类 animal   

function animal(bSex){   

    this.sex = bSex   

    this.getSex = function(){   

        return this.sex   

    }   

}   

// 类静态变量 (如果你不修改它的话~~)   

animal.SEX_G = new Object();    // 雌性   

animal.SEX_B = new Object();    // 雄性   

// 动物子类 鸟   

function bird(bSex){   

    animal.call(this, bSex);   

    this.fly = function(iSpeed){   

        alert("飞行时速高达 " + iSpeed);   

    }   

}   

// 动物子类 鱼   

function fish(bSex){   

    animal.call(this, bSex);   

    this.swim = function(iSpeed){   

        alert("游动时速高达 " + iSpeed)   

    }   

}   

// 鱼 鸟 杂交品种。。。   

function crossBF(bSex){   

    bird.call(this, bSex);   

    fish.call(this, bSex);   

}   

var oPet = new crossBF(animal.SEX_G);    // 雌性 鱼鸟   

    alert(oPet.getSex() == animal.SEX_G ? "雌性" : "雄性");   

    oPet.fly(124)   

    oPet.swim(254)  

 

11.用面向对象的编程方式写JavaScript:

Js代码  

MyTool = new function(){   

        /**  

         * 返回非空字符串,如果有默认值就返回默认字符串.  

         */  

        this.notNull = function(str,defaultStr){   

                if(typeof(str)=="undefined"||str==null||str==‘‘){   

                        if(defaultStr)   

                                return defaultStr;   

                        else  

                                return ‘‘;   

                }   

                else{   

                        return str;   

                }   

        }   

}   

  

rootId = MyTool.notNull(rootId,‘001000‘);    

 

12.常用的js方法,包括表单校验的一些方法,下拉菜单常用的方法等等:

Js代码  

/**  

 * JSON对象转换为字符串.  

 * @param {json对象} json  

 * @return {json字符串}  

 */  

function jsonObj2Str(json) {   

        var str = "{";   

        for (prop in json) {   

                str += prop + ":" + json[prop] + ",";   

        }   

        str = str.substr(0, str.length - 1);   

        str += "}";    

        return str;   

}   

  

/**  

 * json字符串转换为json对象.  

 * @param {json字符串} jsonstr  

 * @return {json对象}  

 */  

function jsonStr2Obj(jsonstr) {   

         return eval("("+jsonstr+")");   

}   

  

/**  

 * 得到一个元素的left坐标值.  

 * @param {dom对象} obj  

 * @return {位置值}  

 */  

function getLeft(obj){    

        var offset=e.offsetLeft;    

        if(e.offsetParent!=null) offset+=getLeft(e.offsetParent);    

        return offset;    

}    

  

/**  

 * 得到一个元素的绝对位置的top坐标值.  

 * @param {dom对象} obj  

 * @return {位置值}  

 */  

function getTop(obj){    

        var offset=e.offsetTop;    

        if(e.offsetParent!=null) offset+=getTop(e.offsetParent);    

        return offset;    

}    

  

/**  

 * 删除一个字符串的左右空格.  

 * @param {原始字符串} str  

 * @return {删除空格之后的字符串}  

 */  

function  trim(str)   

{     

   return  str.replace(/(^\s*)|(\s*$)/g,"");     

}   

  

/**  

 * 根据id取出一个元素.  

 * @param {元素id} str  

 * @return {dom对象}  

 */  

function $(str) {   

        return document.getElementById(str);   

}   

  

/**  

 * name获取一个对象.  

 * @param {元素name} str  

 * @return {根据name返回的第一个对象}  

 */  

function $byName(str) {   

        var arr = document.getElementsByName(str);   

        if (arr)   

                return arr[0];   

        else  

                return null;   

}   

  

/***************以下方法和表单验证相关*************************************************/  

/**  

 * 返回非空字符串,如果有默认值就返回默认字符串.  

 * @param {要进行转换的原字符串} str  

 * @param {默认值} defaultStr  

 * @return {返回结果}  

 */  

function notNull(str, defaultStr) {   

        if (typeof(str) == "undefined" || str == null || str == ‘‘) {   

                if (defaultStr)   

                        return defaultStr;   

                else  

                        return ‘‘;   

        } else {   

                return str;   

        }   

}     

  

/**  

 * 比较两个日期大小.  

 * @param {较小日期的文本框id} smallDate  

 * @param {较大日期的文本框id} bigDate  

 * @param {出错的提示信息} msg  

 */  

function compareTwoDate(smallDate, bigDate, msg) {   

        var v1 = $(smallDate).value;   

        var v2 = $(bigDate).value;   

        if (v1 >= v2) {   

                alert(msg);   

                                v2.focus();   

                return false;   

        }   

        return true;   

}   

  

/**  

 * 比较两个金额大小的方法.  

 * @param {较小的金额} smallNum  

 * @param {较大的金额} bigNum  

 * @param {出错提示信息} msg  

 * @return {Boolean}  

 */  

function compareTwoNum(smallNum, bigNum, msg) {   

        var v1 = $(smallNum).value;   

        var v2 = $(bigNum).value;    

        if (parseFloat(v1) >= parseFloat(v2)) {   

                alert(msg);   

                                v2.focus();   

                return false;   

        }   

        return true;   

}   

  

/**  

 * 检查文本框的长度是否超出指定长度.  

 * @param {文本id} textId  

 * @param {文本框的最大长度} len  

 * @param {文本框描述内容} msg  

 * @return {有错就返回false,否则返回true}  

 */  

function checkLength(textId, len, msg) {   

        obj = $(textId);   

        str = obj.value;   

        str = str.replace(/[^\x00-\xff]/g, "**");   

        realLen = str.length;   

        if (realLen > len) {   

                alert("[" + msg + "]" + "长度最大为" + len + "," + "请重新输入!\n注意:一个汉字占2位。");   

                obj.focus();   

                return false;   

        } else  

                return true;   

}   

  

/**  

 * 判断某个文本框不可以为空.  

 * @param {文本框id} textId  

 * @param {文本框描述内容} msg  

 * @return {有错就返回false,否则返回true}  

 */  

function checkIfEmpty(textId, msg) {   

        var textObj = $(textId);   

        var textValue = textObj.value;   

        if (trim(textValue) == ‘‘) {   

                alert(‘[‘ + msg + ‘]不得为空!‘);   

                textObj.focus();   

                return false;   

        } else {   

                return true;   

        }   

}   

  

/**  

 * 判断指定文本框内容必须为邮件.  

 * @param {文本框id} textId  

 * @param {文本框描述} msg  

 * @return {如果是邮件内容就返回true否则返回false}  

 */  

function checkIsMail(textId, msg) {   

        var obj = $(textId);   

        if (!_isEmail(obj.value)) {   

                alert(‘[‘ + msg + ‘]不是合法的邮件地址!‘);   

                obj.focus();   

                return false;   

        } else  

                return true;   

}   

  

/**  

 * 验证是不是邮件.  

 * @param {要验证的字符串} strEmail  

 * @return {Boolean}  

 */  

function _isEmail(strEmail) {   

        //接下来的验证是否有两个以上的‘.’号,有的话就是错的!   

        var first = strEmail.indexOf(‘.‘);     

        if (strEmail.indexOf(‘@‘)== -1) {   

                return false;   

        }   

        var tempStr = strEmail.substring(first + 1);   

         if (tempStr.indexOf(‘.‘) != -1) {   

                return false;   

        }   

        if (strEmail   

                        .search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1) {   

                return true;   

        } else  

                return false;   

}   

  

/**  

 * 判断某个文本框是否数字.  

 * @param {文本框id} textId  

 * @param {文本框描述内容} msg  

 * @return {Boolean}  

 */  

function checkIsNum(textId, msg) {   

        obj = $(textId);   

        if (isNaN(obj.value)) {   

                alert(‘[‘ + msg + ‘]必须为数字。‘);   

                obj.focus();   

                return false;   

        } else  

                return true;   

}   

  

/**  

 * 判断某个文本框是否含有非法字符.  

 * @param {文本框的id} textId  

 * @param {文本框描述内容} msg  

 * @return {有错就返回false否则返回true}  

 */  

function checkIsValid(textId, msg) {   

        obj = $(textId);   

        if (!_isValidString(obj.value, ‘[‘ + msg + ‘]不得含有非法字符。‘)) {   

                obj.focus();   

                return false;   

        }   

        return true;   

}   

  

/**  

 * 判断是不是合法字符串.  

 * @param {要进行判断的字符串} szStr  

 * @param {文本描述} errMsg   

 * @return {合法则返回true否则返回false}  

 */  

function _isValidString(szStr,errMsg) {   

        voidChar = "‘\"><`~!@#$%^&\(\)()!¥……??“”‘’*";   

        for (var i = 0; i < voidChar.length; i++) {   

                aChar = voidChar.substring(i, i + 1);   

                if (szStr.indexOf(aChar) > -1){   

                        alert(errMsg)   

                        return false;   

                }   

        }   

        return true;   

}    

  

/*************** 以下方法和下拉菜单相关*************************************************/  

/**  

 * 控制下拉菜单不可以为-1(未选择情况value=http://www.mamicode.com/-1)

 * @param {下拉菜单id} selectId  

 * @param {下拉菜单描述内容} msg  

 * @param {下拉菜单的空值对应的value,默认为-1} nullValue  

 * @return {Boolean}  

 */  

function checkChooseSelect(selectId, msg ,nullValue) {   

        var obj = $(selectId);    

        if (obj.value == notNull(nullValue,‘-1‘)) {   

                alert(‘[‘ + msg + ‘]必选!‘);   

                obj.focus();   

                return false;   

        } else  

                return true;   

}   

  

/**  

 * 得到下拉菜单的显示的文字.  

 * @param {下拉菜单dom对象} selectObj  

 * @return {返回下拉菜单的显示的"文本"}  

 */  

function getSelectText(selectObj) {   

       return selectObj.options[selectObj.selectedIndex].text;   

}   

  

/**  

 * 得到下拉菜单的显示的值.  

 * @param {下拉菜单dom对象} selectObj  

 * @return {得到下拉菜单的显示的""}  

 */  

function getSelectValue(selectObj) {   

        return selectObj.options[selectObj.selectedIndex].value;   

}   

  

/**  

 * 设置下拉菜单的选择状态到指定的值.  

 * @param {下拉菜单对象} obj  

 * @param {要选择的值} value  

 */  

function setSelectValue(obj, value) {   

        /*for (i = obj.options.length - 1; i >= 0; i--) {  

                if (obj.options[i].value == value) {  

                        obj.options[i].selected = true;  

                        return;  

                }  

        }  

*/  

      obj.value=http://www.mamicode.com/ value;

}   

  

/**  

 * 根据键值串的内容进行下拉菜单的动态组装  

 * @param {要进行下拉菜单组装的dom对象} obj  

 * @param {键值对用,;分割,例如‘1,;2,;3,未知‘} valAndText  

 */  

function setSelectContent(obj,valAndText){   

        if(trim(valAndText)==‘‘){   

                alert(‘没有要进行组装下拉菜单的数据!‘);   

                return false;                   

        }   

        clearSelect(obj);   

        var keyandvalues = valAndText.split(‘;‘);   

        for(var i=0;i<keyandvalues.length;i++){   

                var arr = keyandvalues[i].split(‘,‘);   

                if(arr){   

                        var value =arr[0];    

                        var text =arr[1];    

                        var objOption = new Option(text,value);   

                        obj.add(objOption);   

                }   

        }   

}   

  

/**  

 * 清空下拉菜单里面的内容.  

 * @param {下拉菜单对象} obj  

 */  

function clearSelect(obj) {    

    for (var i=obj.options.length; i >0; i--) {   

        obj.remove(0);    

    }           

}    

  

/*************** 以下方法和多选框相关*************************************************/  

/**  

 * 返回选中的checksid组成的字符串,逗号隔开.  

 * @param {checks数组} checks  

 * @return 选择的id组成的字符串  

 */  

function getCheckedIds(checks){   

        var selectedValue = ‘‘;   

        var len = checks.length;   

        for(var index=0; index<len; index++) {   

        if(checks[index].checked==true) {   

            selectedValue +=  checks[index].value+",";    

        }   

    }   

        if(selectedValue.length>0)   

                return selectedValue.substring(0,selectedValue.length-1);   

    return selectedValue;   

}  

 将上面的js保存之后,使用下面的html进行测试:

Html代码  

<HTML>  

        <HEAD>  

                <script language="javascript" src="http://www.mamicode.com/aaaaa.js"></script>  

        </HEAD>  

        <SCRIPT LANGUAGE="JavaScript">  

<!--   

/**   

 * 表单验证的示例js方法.   

 */   

function check(){   

        if(checkIfEmpty(‘a‘,‘非空校验‘)   

                &&checkIsMail(‘b‘,‘邮箱校验‘)   

                &&checkIsNum(‘c‘,‘数字校验‘)   

                &&checkIsValid(‘d‘,‘合法性校验‘)   

                &&compareTwoDate(‘e‘,‘f‘,‘小日期与大日期关系错误!‘)   

                &&checkLength(‘g‘,5,‘长度校验‘)   

                &&checkChooseSelect(‘h‘,‘下拉菜单非空‘,‘-1‘)   

                &&compareTwoNum(‘k‘,‘l‘,‘大小数目关系不正确!‘)){   

                alert(‘校验通过!‘);   

                return true;           

        }else{   

                return false;   

        }   

}   

  

/**   

 * 取下拉菜单的值和文本的示例js方法.   

 */   

function getSelect(){   

        var sss = $(‘h‘);   

        alert(‘下拉菜单选择的文本是:‘+getSelectText(sss)+‘\n‘   

                        +‘下拉菜单选择的值是:‘+getSelectValue(sss));   

}   

  

/**   

 * 根据键值字符串设置下拉菜单的显示内容.   

 */   

function setSelect(){   

        var sss = $(‘i‘).value;   

        setSelectContent($(‘h‘),sss);   

}   

  

/**   

 * 返回多选框数组选择状态的id的字符串,结果以逗号隔开.   

 */   

function getMulti(){    

        alert(‘多选选择的id:‘+getCheckedIds(document.getElementsByName(‘j‘)));   

}   

//-->  

</SCRIPT>