Javascript笔记（转）

·字符串
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.截取字符串
     //截取第 6 位开始的字符
     var myString = "Every good boy does fine.";
     var section = myString.substring(6);     //结果: "good boy does fine."
     //截取第 0 位开始至第 10 位为止的字符
     var myString = "Every good boy does fine.";
     var section = myString.substring(0,10); //结果: "Every good"
     //截取从第 11 位到倒数第 6 位为止的字符
     var myString = "Every good boy does fine.";
     var section = myString.slice(11,-6);     //结果: "boy does"
     //从第 6 位开始截取长度为 4 的字符
     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); //返回Unicode为66的字符
   10.将字符串转换成URL编码
     var myString = "hello all";
     var code = encodeURI(myString);      //结果: "hello%20all"
     var str = decodeURI(code);           //结果: "hello all"
     //相应的还有:   encodeURIComponent()   decodeURIComponent()
   11.将字符串转换成base64编码
     // base64Encode()   base64Decode()   用法同上
//-----------------------------------------------------------------------
·数字型(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)
//-----------------------------------------------------------------------
·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) : 返回num1和num2中较大的一个
   12.Math.min(num1,num2) : 返回num1和num2中较小的一个
   13.Math.pow(x,y) : 返回x的y次方的值
   14.Math.random() : 返回0到1之间的一个随机数
   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)
//-----------------------------------------------------------------------
·日期型(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-????),一般都要用full，防止FF出错
     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 ) ){ }
//-----------------------------------------------------------------------
·数组(Array)
   1.声明
     var arr = new Array();       //声明一个空数组
     var arr = new Array(10);     //声明一个10个长度的数组
     var arr = new Array("Alice", "Fred", "Jean");    //用值初始化数组
     var arr = ["Alice", "Fred", "Jean"];     //用值初始化数组
     var arr = [["A","B","C"][1,2,3]];    //声明一个二(多)维数组
   2.数组的访问
     arr[0] = "123";      //赋值
     var str = arr[0];    //获取
     arr[0][0] = "123";   //多维数组赋值
   3.数组与字符串间的转换
     var arr = ["A","B","C","D"];     //声明
     //数组按分隔符转换成字符串
     var str = arr.join("|");         //结果: "A|B|C|D"
     //字符串切割成数组
     arr = str.split("|");
   4.遍历数组
     for( var i=0; i<arr.length; i++ ){ alert(arr[i]); }
   5.排序
     var arr = [12,15,8,9];
     arr.sort(); //结果: 8 9 12 15
   6.组合与分解数组
     var arr1 = ["A","B","C","D"];
     var arr2 = ["1","2","3","4"];
     //奖两个数组组合成一个新的数组
     var arr = arr1.concat(arr2); //结果: ["A","B","C","D","1","2","3","4"]
     //将一个数组切成两个数组(参数1:起始索引,参数2:切割长度)
     var arr3 = arr.splice(1,3); //结果: arr3:["B","C","D"] arr["A","1","2","3","4"]
     //将一个数组切成两个数组,并在原数组补新值
     var arr4 = arr.splice(1,3,"AA"); //结果: arr4:["B","C","D"] arr["A","AA","1","2","3","4"]
//-----------------------------------------------------------------------
·自定义对象
   1.声明:
     function myUser(uid,pwd){
         this.uid = uid;
         this.pwd = pwd || "000000"; //默认值
         this.show = showInfo;        //方法
     }
     //下面的函数不是自定义对象,是自定义对象的方法.继续看下去就明白了
     function showInfo(){
         alert("用户名:" + this.uid + ",密码:" + this.pwd)
     }
   2.实例化:
     var user = new myUser("user","123456");
     var user = {uid:"user",pwd:"123456"};
   3.获取与设置
     alert("用户名是:" + user.uid);   //get
     user.uid = "newuser";            //set
     user.show();                     //调用show()方法
//-----------------------------------------------------------------------
·变量 函数 流程控制
   1.变量
     var i = 1;
     var i = 1, str = "hello";
   2.函数
     function funName(){
         //do something.
     }
     function funName(param1[,paramX]){
         //do something.
     }
   3.嵌套函数
     //某种情况,你需要创建一个函数本身所独有的函数.
     function myFunction(){
         //do something.
         privateFunction();
         function privateFunction(){
             //do something.
         }
     }
   4.匿名函数
     var tmp = function(){ alert("only test."); }
     tmp();
   5.延迟函数调用
     var tId = setTimeout("myFun()",1000);    //延迟1000毫秒后再调用myFun()函数
     fucntion myFun(){
         //do something
         clearTimeout(tId);   //销毁对象
     }
   6.流程控制
     if( condition ){ }
     if( condition ){ } else{ }
     if( condition ){ } else if( condition ){ } else{ }
     switch( expression ){
         case valA : statement; break;
         case valB : statement; break;
         default : statement; break;
     }
   7.异常捕获
     try{ expression } catch(e){ } finally{ }
     //不处理任何异常
     window.onerror = doNothing;
     function doNothing(){ return true; }
     //异常类可用的属性
     Description : 异常描述(IE,NN)
     fileName     : 异常页面URI(NN)
     lineNumber   : 异常行数(NN)
     message      : 异常描述(IE,NN)
     name         : 错误类型(IE,NN)
     number       : 错误代码(IE)
     //错误信息(兼容所有浏览器)
     try{ }
     catch(e){
         var msg = (e.message) ? e.message : e.description;
         alert(msg);
     }
   8.加快脚本的执行速度需要注意的几点
     -避免使用 eval() 函数
     -避免使用 with 关键字
     -将重复的表达式赋值精简到最小
     -在较大的对象中使用索引来查找数组
     -减少 document.write() 的使用
//-----------------------------------------------------------------------
·浏览器特征( navigator )
   1.浏览器名称
     //IE : "Microsoft Internet Explorer"   
     //NS : "Netscape"
     var browserName = navigator.appName;
判断IE浏览器版本：if（navigator.userAgent.indexOf("MSIE6.0")>0）{…} // "MSIE7.0" "MSIE"
   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.判断是否支持某对象,方法,属性
     //当一个对象,方法,属性未定义时会返回undefined或null等,这些特殊值都是false
     if( document.images ){ }
     if( document.getElementById ){ }
   5.检查浏览器当前语言
     if( navigator.userLanguage ){ var l = navigator.userLanguage.toUpperCase(); }
   6.检查浏览器是否支持Cookies
     if( navigator.cookieEnabled ){…}
//-----------------------------------------------------------------------
·控制浏览器窗口( window )
   1.设置浏览器的大小
     window.resizeTo(800, 600);   //将浏览器调整到800X600大小
     window.resizeBy(50, -10);    //在原有大小上改变增大或减小窗口大小
   2.调整浏览器的位置
     window.moveTo(10, 20);       //将浏览器的位置定位到X:10 Y:20
     window.moveBy(0, 10);        //在原有位置上移动位置(偏移量)
   3.创建一个新的窗口
     var win = window.open("about.htm","winName","height=300,width=400");
     //参数
     alwaysLowered    //始终在其它浏览器窗口的后面(NN)
     alwaysRaised     //始终在其它浏览器窗口的前面(NN)
     channelMode      //是否为导航模式(IE)
     copyhistory      //复制历史记录至新开的窗口(NN)
     dependent        //新窗口随打开它的主窗口关闭而关闭(NN)
     fullscreen       //全屏模式(所有相关的工具栏都没有)(IE)
     location         //是否显示地址栏(NN,IE)
     menubar          //是否显示菜单栏(NN,IE)
     scrollbars       //是否显示滚动条(NN,IE)
     status           //是否显示状态栏(NN,IE)
     toolbar          //是否显示工具栏(NN,IE)
     directories      //是否显示链接栏(NN,IE)
     titlebar         //是否显示标题栏(NN)
     hotkeys          //显示菜单快捷键(NN)
     innerHeight      //内容区域的高度(NN)
     innerWidth       //内容区域的宽度(NN)
     resizable        //是否可以调整大小(NN,IE)
     top              //窗口距离桌面上边界的大小(NN,IE)
     left             //窗口距离桌面左边界的大小(NN,IE)
     height           //窗口高度(NN,IE)
     width            //浏览器的宽度
   4.与新窗口通讯
     win.focus();   //让新窗口获得焦点
     win.document.write("abc");   //在新窗口上操作
     win.document.close();        //结束流操作
     opener.close();
   5.模式窗口
     window.showModalDialog("test.htm",dialogArgs,"param");       //传递对象
     window.showModelessDialog("test.htm",myFunction,"param");    //传递函数
     window.dialogArguments   //对话框访问父窗口传递过来的对象
     window.returnValue       //父窗口获取对话框返回的值
     //参数
     center           //窗口居中屏幕
     dialogHeight     //窗口高度
     dialogWidth      //窗口宽度
 

    dialogTop       //窗口距离屏幕的上边距
     dialogLeft      //窗口距离屏幕的左边距
     edge             //边框风格(raised|sunken)
     help             //显示帮助按钮
     resizable        //是否可以改变窗口大小
     status           //是否显示状态栏
     //例子
     <script>
         function openDialog(myForm) {
             var result = window.showModalDialog("new.html",myForm,"center");
         }
     </script>
     <form action="#" onsubmit="return false">
         <input type="text" id="txtId">
         <input type="button" id="btnChk" value="验证是否可用" onclick="openDialog(this.form);">
     </form>
     //另一个页面new.html
     <script>
         window.dialogArguments.btnChk.enabled = false;   //将父窗口中的按钮设置为不可用
         //do something to check the Id.
         window.write("用户ID: " + window.dialogArguments.txtId.value + " 可使用!");
 

//获取文本框的值
     </script>
//-----------------------------------------------------------------------
·管理框架网页( frames )
   1.创建一个框架架构网页
     <html>
     <frameset rows="50, *">
         <frame name="header" src="header.html">
         <frame name="main" src="main.html">
     </frameset>
     </html>
<iframe width="500px" height="20px" align="center" scrolling="no" frameborder="0" src="a.html" allowtransparency="true"></iframe>
//a.html页面background:url(a.gif) transparent no-repeate 2px 9px;    //iframe页面背景透明
   2.访问框架网页
     window.frames[i]
     window.frames["frameName"]
     window.frameName
     window.frames["frameName"].frames["frameName2"]
     parent.frames["frameName"]
     top.frames["frameName"]
   3.将某一页面定向到某框架
 

<frame name="main" src="main.html">//框架主页index.html
     //框架内容页面
     <a href="new.html" target="main">
     location = "new.html";
     parent.frameName.location.href = "new.html";
     top.frameName.location = "new.html";
   4.强制不让其它框架引用某页面
     if (top != self) {
         top.location.href = location.href;
     }
   5.更改框架的大小
     document.framesetName.rows = "50,*";
     document.framesetName.cols = "50,*";
   6.动态创建框架网页
     var frag = document.createDocumentFragment( );
     var newFrame= document.createElement("frame");
     newFrame.id = "header";
     newFrame.name = "header";
     newFrame.src="header.html"
     frag.appendChild(newFrame);
     newFrame = document.createElement("frame");
     newFrame.id = "main";
     newFrame.name = "main";
     newFrame.src="main.html"
     frag.appendChild(newFrame);
     document.getElementById("masterFrameset").rows = "50,*";
//-----------------------------------------------------------------------
·表单( forms )
   1.访问表单
     document.forms[0]
     document.forms["myForm"]
     document.myForm
     document.all.myForm
     document.getElementById("myForm")
     document.forms[0].elements[0]
     document.forms["myForm"].elements["myElement"]
     document.myForm.myElement
   2.让文本框自动获得焦点
     //让名为myText的文本框在页面加载时自动获得焦点,并选中当前文本框的值
     <body onload="document.myForm.myText.focus(); document.myForm.myText.select();">
   3.通用的文本框验证函数
     //验证是否为空
     <input type="text" onchange="isEmpty(this)">
     function isEmpty(obj){
         if(obj.value == null || obj.value == "") alert("此字段不能为空");
     }
     //验证是否为数字
     <input type="text" onchange="isNumber(this)">
     function isNumber(obj){
         var val = obj.value;
         var r = /"w[0-9]{1,}/;
         if( !r.test(val) ) alert("此字段必须为数字")
     }
     //验证是否长度符合
     <input type="text" onchange="isLen7(this)">
     function isLen7(obj){
         if(obj.value.length != 7) alert("此字段长度必须为7位");
     }
     //验证有效E-Mail地址
     <input type="text" onchange="isEmail(this)">
     function isEmail(obj){
         var val = obj.value;
         var r = /^"w[0-9a-zA-Z."-]{3,}@"w[0-9a-zA-Z."-]{2,}."w[a-zA-Z.]{2,4}$/;
         if( !r.test(val) ) alert("请输入有效的E-Mail地址");
     }
   4.阻止表单提交
     <form action="#" onsubmit="return checkValue()"></form>
     function checkValue(){
         //do something to check the value.
         return false;
     }
   5.改变表单提交的页面
     <form action="#" onsubmit="chooseAction()"></form>
     fucntion chooseAction(){
         if(document.myForm.myCheckBox.checked) document.myForm.action ="a.asp";
         else document.myForm.action = "b.asp";
    }
   6.阻止向文本框输入某些字符
     <input type="text" onkeydown="checkKeyCode(event)">
     fucntion checkKeyCode(evt){
         evt = (evt) ? evt : event;
         var c = (evt.charCode) ? evt.charCode : evt.keyCode;
         if(c < 48 || c > 57){
             alert("此字段只允许输入数字");
             return false;
         }
         else return true;
     }
   7.回车后焦点跳到另一个输入控件
     <input id="txt1" type="text" onkeypress="return focusNext(this,'txt2',event)">
     <input id="txt2" type="text">
     function focusNext(form,name,evt){
         evt = (evt) ? evt : event;
         var c = (evt.charCode) ? evt.charCode : evt.keyCode;
         if(c == 13 || c == 3){
             form.elements[name].focus();
             return false;
         }
         else return true;
    }
   8.使某一控件不可用
     document.myForm.myElement.disabled = true;
   9.隐藏/显示某一控件
     document.myForm.myElement.style.display = "block";   //显示
     document.myForm.myElement.style.display = "none";    //隐藏
   10.控制下拉框
     //清空下拉框中的项
     document.myForm.mySelect.options.length = 0;
     //添加下拉框中的项
     var item = new Option("myText","myValue");
     document.myForm.mySelect.add(item);
     //获取下拉框当前选中的值
     var val = document.myForm.mySelect.value;
//-----------------------------------------------------------------------
·事件( Event )
   1.事件介绍:
     onabort      //当用户阻止发送图片至客户端时触发
     onblur       //当控件失去焦点时触发
     onchange     //当控件失去焦点并且内容发生了改变时触发
     onclick      //当用户点击某控件时触发
     ondblclick   //当用户双击某控件时触发
     onerror     //当执行某脚本发生异常时触发
     onfocus      //当某控件获得焦点时触发
     onkeydown    //当用户按下键盘某个键时触发
     onkeypress   //当用户按下并松开键盘某个键时触发
     onkeyup      //当用户松开键盘某个键时触发
     onload       //用页面被加载完成后触发
     onmousedown //当用户按下鼠标时触发
     onmousemove //当用户移动鼠标时触发
     onmouseout   //当用户将鼠标移出某控件时触发
     onmouseover //当用户将鼠标移入某控件时触发
     onmouseup    //当用户松开鼠标时触发
     onmove       //当用户移动浏览器窗口时触发
     onreset      //当用户点击表单"重置"按钮时触发
     onresize     //当用户改变浏览器窗口的大小时触发
     onselect     //当用户选中文本框内容时触发
     onsubmit     //当用户点击表单"提交"按钮时触发
     onunload     //当用户关闭浏览器时触发
     //以下为IE独有的方法
     onbeforecopy     //当用户使用"复制"功能前触发
     onbeforecut      //当用户使用"剪切"功能前触发
     onbeforepaste    //当用户使用"粘贴"功能前触发
     onbeforeprint    //当用户使用"打印"功能前触发
     oncontextmenu    //当用户调出上下文菜单时触发
     oncopy           //当用户使用"复制"功能时触发(未复制)
     oncut            //当用户使用"剪切"功能时触发(未剪切)
     ondrag           //当用户拖动某控件前触发
     ondragend        //当用户拖动某控件后触发
     ondragenter      //当用户拖动某控件到当前控件上面后触发
     ondragleave      //当用户将某控件拖出当前控件时触发
     ondragover       //当用户将某控件拖出当前控件上面时触发
     ondrop           //当用户将某控件拖到当前控件后触发
   2.浏览器事件兼容性
     function funName(evt){
         evt = (evt) ? evt : event;
         if(evt){ //to do something }
     }
   3.动态为控件添加事件
     document.getElementById("myControl").addEventListener("click",funName,false);
     document.getElementById("myControl").onclick = funName;
   4.页面加载后调用某函数
     <body onload="funName(); funName2();">调用多个函数<body onload="functionName(); a(); b(); c();">
     window.onload = funName;
   5.确定与点击事件相匹配的事件
     //9.3和9.4 比较复杂.且不清楚事件是JS API还是自定义的
   6.防止重复执行两次点击事件
     //当第一次点击按钮后,将表单提交回服务器,然后submitForm()函数便指向blockIt()函数.
     //除非页面重新加载..否则点击无效(无作用)
     <input type="button" value="提交" onclick="submitForm()">
     function submitForm(){
         document.forms["myForm"].submit();
         submitForm = blockIt;
         reutrn false;
     }
     function blockIt(){
         return false;
     }
   7.阻止用户点击鼠标右键或中键
     function myFun(evt){
         evt = (evt) ? evt : event;
         if(evt.button || evt.button == 1 || evt.button == 2){ return false; }
         else{ //do something }
     }
   8.阻止用户键入某些字符
     function myFun(evt){
         evt = (evt) ? evt : event;
         var c = (evt.charCode) ? evt.charCode : evt.keyCode;
         if(c < 48 || c > 57){ return false; }
         else reutrn true;
     }
   9.获取当前鼠标指向的对象
     function myFun(evt){
         evt = (evt) ? evt : event;
         var elem = (evt.target) ? evt.target : evt.srcElement;
         //do something
     }
   10.特殊功能键
     evt.ctrlKey   evt.altKey   evt.shiftKey
   11.播放媒体文件
 

     <object id="hiPing" width="1" height="1" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95" codebase="#Version=6,0,0,0">
         <param name="FileName" value="hi.wav">
         <param name="AutoStart" value="false">
     </object>
     function playSound(id){
         if(document.all[id].FileName){ document.all[id].Play(); }
     }
//-----------------------------------------------------------------------
·页面导航
   1.跳转至另一个页面
     location = "newPage.html";
     location.href = "newPage.html";
   2.不记录历史记录的页面跳转
     location.replace("newPage.html");
   3.利用下拉框跳转页面
     <select name="chooser" id="chooser" onchange="redirect()">
         <option value="">Choose a Destination:</option>
         <option value="index.html">Home</option>
         <option value="products.html">Products</option>
         <option value="support.html">Support</option>
         <option value="contact.html">Contact Us</option>
     </select>
     function redirect(){
         var t = document.all.chooser.value;
         if(t){ location = t; }
     }
   4.利用Cookies保存用户数据
     <body onunload="saveData()">     //要保存数据的页面
     <body onload="readData()">       //新页面
     function saveData(){
         var data = document.forms[0].userName.value;
         var expDate = getExpDate(180, 0, 0);
         setCookie("userName", data, expDate);
     }
     function readData( ) {
         var data = getCookie("userName");
         document.forms[0].userName.value = data;
     }
   5.利用URL来保存用户数据
     function goNext(url){
         var data = document.forms[0].userName.value;
         location.href = url + "?" + escape(data);
     }
     function readData( ) {
         var srchString = unescape(location.search.substring(1,location.search.length));
         if (srchString.length > 0){ document.forms[0].userName.value = srchString; }
     }
  6.创建一个自定义右键菜单
     //菜单就自己画了,这里只说方法
     function initContextMenus(){
         if (document.body.addEventListener){
             document.body.addEventListener("contextmenu", showContextMenu, true);
             document.body.addEventListener("click", hideContextMenus, true);
         }
         else {
             document.body.oncontextmenu = showContextMenu;
         }
         setContextTitles( );
     }
//-----------------------------------------------------------------------
·管理样式 ( CSS )
   1.三种嵌入样式表的方法:
     //在头部统一声明样式
     <style type="text/css"> body{ font-size:9pt; } </style>
     //从外部嵌入一样式表文件
     <link rel="stylesheet" rev="stylesheet" type="text/css" href="myStyleSheet.css">
     //直接在元素属性里定义
     <p style="font-size:9pt">

   2.分配样式规则给某一元素
     <style type="text/css">
         <!-- tagName {styleProperty1:value1; styleProperty2:value2; ...} -->
     </style>
   3.自定义一种样式供一类元素使用
     .myStyle { font-size:9pt; }
     <p class="myStyle">

   4.自定义一种样式供单一元素使用
     #myId { font-size:9pt; }
     <p id="myId">

   5.页面加载后动态修改页面样式表链接
     <link id="basicStyle" rel="stylesheet" rev="stylesheet" type="text/css" href="style1.css">
     document.getElementById("basicStyle").href = "newstyle.css";
   6.打开/关闭某个样式表
     document.styleSheets[1].disabled = false;
   7.动态设置/更改某一元素的样式
     document.getElementById("myElement").className = "myStyle";
   8.元素样式的优先级
      Element << class << id << style
     //原则上来讲,浏览器会使用最后的一种样式(就近原则)
     //当同时给一元素设置id和class两种样式时,id的样式优先于class
     //当同时给一元素设置class和style两种样式时,style优先于class
     //当同时给一元素设置style和id两种样式时,style优先于id
     <style>
         .myStyle { font-size:10pt; }
         #myId { font-size:11pt; }
     </style>
     <p id="myId" class="myStyle" style="font-size:12pt">123

   9.css选择符
     子对象选择符 > //版本ie7+，只有直系儿子起作用
        Eg：#test1 > p //对id是test1的div，它内部的属性标签是p的内容起作用。
     相邻选择符 + //只对邻居有效果，对邻居的邻居无效果
        Eg：#test5+p//对属性标签是p，对test的下一个如<p id="test6">的有效果
     属性选择符 < a href="#" title="链接到其他页面">
        Eg：a[href="#"]{……}    a[title="链接到其他页面"]{……}
            外站链接target="_blank" <a href="xx.html" title="outlink">outlink</a>
            a[target="_blank"]{background:url() no-repeat center right}
            [att^=val]开头包含   [att*=val]任何位置包含   [att$=val]结尾包含
            a[href$=".zip"]     a[href^="mailto"]    a[href*="http://www.kx1d.com"]
     伪类伪对象
 

Eg：a:link,a:visited,a:hover,a:active{………}
 

    #text a:link, #text a:visited, #text a:hover, #text a:active{…}//text是大div
 

#childtext:link, #childtext:visited, #childtext:hover, #childtext:active{…}//小div
 

    #style1:first-line{……}
 

    #style1:first-letter{……}
   10.hover对所有元素OK使用 // IE不要不支持，FF和Google浏览器支持 
        Eg：.divtest{background：…}
            .divtest：hover{background：…}   
//-----------------------------------------------------------------------
·动态更改对象的视觉效果
   1.更改对象的字体样式
     document.getElementById("myElement").style.color = "#EEEEEE";
     document.getElementById("myElement").src = "**.html";
     document.getElementById("myElement").className = "menu";
 

onmouseover="javascript:this.className=style2" onmouseout="javascript:this.className=style1"
     //相应的属性
     color : 字体的颜色
     font : 字体的全局设置
     fontfamily : 字体名称
     fontSize : 字体大小(pt, px)
     fontStretch : 字符间隔(px)
     fontStyle : 字体的样式(normal, italic)
     fontVariant : 字母大小常量(normal, small-caps)
     fontWeight : 字体粗细(bold, bolder, lighter, normal)
     textDecoration : 字体装饰(blink, line-through, none, overline, underline)
     textTransform : 字母大小写(capitalize, lowercase, none, uppercase)
   2.更改页面背景样式
     document.body.background = "url(bg.gif) repeat fixed";
     //相应的属性
     background : 背景的全局设置
     backgroundAttachment : 背景是否随滚动条滚动而滚动(fixed, scroll)
     backgroundColor : 背景颜色
     backgroundImage : 背景图片
     backgroundPosition : 背景图片的位置(bottom, center, left, right, top)
     backgroundRepeat : 背景图片是否重复或拉伸(no-repeat, repeat, repeat-x, repeat-y)
   3.显示/隐藏某对象
     document.getElementById("myElement").style.visibility = "hidden";//visible
     document.getElementById("myElement").style.display = "none";
   4.细调对象的透明度
     document.getElementById("myElement").style.filter = "alpha(opacity=80)";
     透明度写法filter:alpha(opacity=50); //IE   opacity:0.5;//FF Google
//-----------------------------------------------------------------------
·布置HTML对象的位置
   1.动态更改对象的位置
     <div id="myDiv" style="position:absolute; left:100px; top:100px">Content Here</div>
     document.getElementById("myDiv").style.top = "200px";
   2.设置对象在页面上的层次关系
     //值越大对象越前面
     document.getElementById("myElement").style.zIndex = 123;
//-----------------------------------------------------------------------
·动态创建内容
   1.页面加载时动态创建内容
    

现在是：<script>var d = new Date(); document.write(d.toLocaleTimeString());</script>

   2.动态重画页面
     <input type="text" id="txtName"><input type="button" value="确定" onclick="rewritePage()">
     <scritp>
     function rewritePage(){
         var user = document.getElementById("txtName").value;
         var html = "<html><head><title>欢迎</title></head>";
         html += "<body>欢迎您！" + user + "</body></html>";
         document.write(html);
         document.close();
     }
     </script>