JavaScript高级教程

JavaScript浏览器检测PreviousPageNextPage实例检测浏览器及版本使用JavaScript检测关于访问者的浏览器名称及其版本。检测浏览器的更多信息使用JavaScript检测关于访问者浏览器的更多信息。检测浏览器的全部信息使用JavaScript检测关于访问者浏览器的全部信息。根据浏览器类型提醒用户使用JavaScript检测关于访问者的浏览器名称及其版本，然后根据这些信息生成不同内容的警告框。浏览器检测本教程中几乎所有的代码均可在任何支持JavaScript的浏览器中运行。不过个别的代码无法运行于特定的浏览器，特别是老式的浏览器。所以，有些时候对访问者的浏览器类型及版本进行检测是很有帮助的，然后可在此基础上为访问者提供合适的信息。要做到这一点，最好的办法是使你的网页变得足够聪明，这样的话它就可以不同的方式对待不同类型的浏览器。JavaScript包含一个名为Navigator的对象，它就可以完成上述的任务。Navigator包含了有关访问者浏览器的信息，包括浏览器类型、版本等等。Navigator对象JavaScriptNavigator对象包含了有关访问者浏览器的所有信息。接下来我们学习Navigator对象的两个属性。appName保存浏览器类型appVersion存有浏览器的版本信息（其他信息中的一项）实例htmlbodyscripttype=text/javascriptvarbrowser=navigator.appNamevarb_version=navigator.appVersionvarversion=parseFloat(b_version)document.write(Browsername:+browser)document.write(br/)document.write(Browserversion:+version)/script/body/html上面例子中的browser变量存有浏览器的名称，比如，Netscape或者MicrosoftInternetExplorer。上面例子中的appVersion属性返回的字符串所包含的信息不止是版本号而已，但是现在我们只关注版本号。我们使用一个名为parseFloat()的函数会抽取字符串中类似十进制数的一段字符并将之返回，这样我们就可以从字符串中抽出版本号信息了。重要事项：在IE5.0及以后版本中，版本号是不正确的！在IE5.0和IE6.0中，微软为appVersion字符串赋的值是4.0。怎么会出现这样的错误呢？无论如何，我们需要清楚的是，JavaScript在IE6、IE5和IE4中的获得的版本号是相同的。实例下面的脚本会根据访问者的浏览器类型显示不同的警告。htmlheadscripttype=text/javascriptfunctiondetectBrowser(){varbrowser=navigator.appNamevarb_version=navigator.appVersionvarversion=parseFloat(b_version)if((browser==Netscape||browser==MicrosoftInternetExplorer)&&(version=4)){alert(Yourbrowserisgoodenough!)}else{alert(It'stimetoupgradeyourbrowser!)}}/script/headbodyonload=detectBrowser()/body/htmlJavaScriptCookiesPreviousPageNextPagecookie用来识别用户。实例创建一个欢迎cookie利用用户在提示框中输入的数据创建一个JavaScriptCookie，当该用户再次访问该页面时，根据cookie中的信息发出欢迎信息。什么是cookie?cookie是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个cookie。你可以使用JavaScript来创建和取回cookie的值。有关cookie的例子：名字cookie当访问者首次访问页面时，他或她也许会填写他/她们的名字。名字会存储于cookie中。当访问者再次访问网站时，他们会收到类似WelcomeJohnDoe!的欢迎词。而名字则是从cookie中取回的。密码cookie当访问者首次访问页面时，他或她也许会填写他/她们的密码。密码也可被存储于cookie中。当他们再次访问网站时，密码就会从cookie中取回。日期cookie当访问者首次访问你的网站时，当前的日期可存储于cookie中。当他们再次访问网站时，他们会收到类似这样的一条消息：YourlastvisitwasonTuesdayAugust11,2005!。日期也是从cookie中取回的。创建和存储cookie在这个例子中我们要创建一个存储访问者名字的cookie。当访问者首次访问网站时，他们会被要求填写姓名。名字会存储于cookie中。当访问者再次访问网站时，他们就会收到欢迎词。首先，我们会创建一个可在cookie变量中存储访问者姓名的函数：functionsetCookie(c_name,value,expiredays){varexdate=newDate()exdate.setDate(exdate.getDate()+expiredays)document.cookie=c_name+=+escape(value)+((expiredays==null)?:;expires=+exdate.toGMTString())}上面这个函数中的参数存有cookie的名称、值以及过期天数。在上面的函数中，我们首先将天数转换为有效的日期，然后，我们将cookie名称、值及其过期日期存入document.cookie对象。之后，我们要创建另一个函数来检查是否已设置cookie：functiongetCookie(c_name){if(document.cookie.length0){c_start=document.cookie.indexOf(c_name+=)if(c_start!=-1){c_start=c_start+c_name.length+1c_end=document.cookie.indexOf(;,c_start)if(c_end==-1)c_end=document.cookie.lengthreturnunescape(document.cookie.substring(c_start,c_end))}}return}上面的函数首先会检查document.cookie对象中是否存有cookie。假如document.cookie对象存有某些cookie，那么会继续检查我们指定的cookie是否已储存。如果找到了我们要的cookie，就返回值，否则返回空字符串。最后，我们要创建一个函数，这个函数的作用是：如果cookie已设置，则显示欢迎词，否则显示提示框来要求用户输入名字。functioncheckCookie(){username=getCookie('username')if(username!=null&&username!=){alert('Welcomeagain'+username+'!')}else{username=prompt('Pleaseenteryourname:',)if(username!=null&&username!=){setCookie('username',username,365)}}}这是所有的代码：htmlheadscripttype=text/javascriptfunctiongetCookie(c_name){if(document.cookie.length0){c_start=document.cookie.indexOf(c_name+=)if(c_start!=-1){c_start=c_start+c_name.length+1c_end=document.cookie.indexOf(;,c_start)if(c_end==-1)c_end=document.cookie.lengthreturnunescape(document.cookie.substring(c_start,c_end))}}return}functionsetCookie(c_name,value,expiredays){varexdate=newDate()exdate.setDate(exdate.getDate()+expiredays)document.cookie=c_name+=+escape(value)+((expiredays==null)?:;expires=+exdate.toGMTString())}functioncheckCookie(){username=getCookie('username')if(username!=null&&username!=){alert('Welcomeagain'+username+'!')}else{username=prompt('Pleaseenteryourname:',)if(username!=null&&username!=){setCookie('username',username,365)}}}/script/headbodyonLoad=checkCookie()/body/htmlJavaScript表单验证PreviousPageNextPageJavaScript可用来在数据被送往服务器前对HTML表单中的这些输入数据进行验证。JavaScript表单验证JavaScript可用来在数据被送往服务器前对HTML表单中的这些输入数据进行验证。被JavaScript验证的这些典型的表单数据有：用户是否已填写表单中的必填项目？用户输入的邮件地址是否合法？用户是否已输入合法的日期？用户是否在数据域(numericfield)中输入了文本？必填（或必选）项目下面的函数用来检查用户是否已填写表单中的必填（或必选）项目。假如必填或必选项为空，那么警告框会弹出，并且函数的返回值为false，否则函数的返回值则为true（意味着数据没有问题）：functionvalidate_required(field,alerttxt){with(field){if(value==null||value==){alert(alerttxt);returnfalse}else{returntrue}}}下面是连同HTML表单的代码：htmlheadscripttype=text/javascriptfunctionvalidate_required(field,alerttxt){with(field){if(value==null||value==){alert(alerttxt);returnfalse}else{returntrue}}}functionvalidate_form(thisform){with(thisform){if(validate_required(email,Emailmustbefilledout!)==false){email.focus();returnfalse}}}/script/headbodyformaction=submitpage.htmonsubmit=returnvalidate_form(this)method=postEmail:inputtype=textname=emailsize=30inputtype=submitvalue=Submit/form/bo