您好,欢迎访问三七文档
当前位置:首页 > 商业/管理/HR > 人事档案/员工关系 > JavaScript 快速入门资料
JavaScript快速入门主要内容:•JavaScript:是属于网络的脚本语言!被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。是因特网上最流行的脚本语言。•JQuery:是一个JavaScript库。极大地简化了JavaScript编程。•JSON:是存储和交换文本信息的语法。类似XML。JSON比XML更小、更快,更易解析。•Ajax:AJAX=AsynchronousJavaScriptandXML(异步的JavaScript和XML)。AJAX是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。21JavaScript简介•写入HTML输出document.write(h1Thisisaheading/h1);•对事件作出反应buttontype=buttononclick=alert('Welcome!')点击这里/button•改变HTML内容x=document.getElementById(demo)//查找元素x.innerHTML=HelloJavaScript;//改变内容•改变HTML图像•改变HTML样式•验证输入ifisNaN(x){alert(NotNumeric)};实例:javascript/test1.html3•简单性–没有复杂的语法和规则,它的变量类型采用弱类型,并未使用严格的数据类型,易于学习和掌握。•大小写敏感•事件驱动–可以编程通过输入设备应答用户动作。•使用分号组合语句–在JavaScript中分号不是必要的。但好的做法是脚本语句(如声明变量)之后使用分号。•安全性高–不允许访问本地硬盘,不能将数据存入到服务器,不允许对网络文档进行修改和删除,有效防止数据的丢失。42JavaScript程序结构•JavaScript是脚本语言,单条JavaScript语句就能构成一个完整程序,程序结构十分简单。•JavaScript程序需要结合到具体HTML文件才能正确执行。–js独立脚本文件形式–script标记块形式–具体的事件属性方式5独立js脚本文件形式•通过script标记将JavaScript文件引入文件中scriptlanguage=javaScriptsrc=1-1.js•script标记有两个重要属性:language和src–language表示脚本程序使用的语言,这里是JavaScript–src表示JavaScript文件路径通过独立的文件定义JavaScript程序,适合于创建在网站中重用的脚本功能。6script标记块形式•通过script标记和HTML结合,即通过script将其直接嵌入HTML文件–script语句块中的JavaScript程序在整个页面中可以重用。–重用度没有独立的JavaScript文件通用。SCRIPTlanguage=javaScriptdocument.write(bHelloJavaScript!/b)/SCRIPT7具体的事件属性方式•通过事件属性和HTML结合,即将JavaScript程序语句直接写在HTML标记的事件属性中,而不需要script标记。–程序设计方式灵活–代码无法重用inputtype=“button”onclick=“i=20;i=i+100;alert(i)”value=“clickme”/8实例1:script标记块形式通过script将其直接嵌入HTML文件。HTMLBODYH1欢迎光临JavaScript世界/h1SCRIPTlanguage=javaScriptdocument.write(bHelloJavaScript!/b)/SCRIPTH2thisisJavaScript/h2/BODY/HTMLHTMLHEADTITLE欢迎你!/TITLESCRIPTlanguage=“JavaScript”alert(“大家好才是真的好!”);/SCRIPT/HEADBODYpalign=center都好!/p/BODY/HTML实例1-1:HTMLHEADTITLE欢迎你!/TITLESCRIPTtype=text/javascriptalert(大家好才是真的好!);/SCRIPT/HEADBODYpalign=center都好!/p/BODY/HTML实例1-2:实例2:使用JavaScript源文件:source.htmJavaScriptCode.js:alert(“大家好才是真的好!”);HTMLHEADTITLE欢迎你!/TITLESCRIPTLANGUAGE=”JavaScript”SRC=”JavaScriptCode.js”/SCRIPT/HEADBODYpalign=center都好!/p/BODY/HTML3变量与数组•变量和数组是JavaScript的基础。JavaScript和C语言属于同一语系,许多基本语法一样。•JavaScript定义变量只有一个关键字“var”。–例:在JavaScript中定义一个用户名变量的语法为varstrUserName;13JavaScript中变量•Javascript中变量是一种智能化变量,所有变量都以var关键字声明,不再区分具体数字类型。varstrName;vari=0;•var变量在声明时,其具体数据类型不确定,当具体的初始数值被设置给变量后,变量的类型才确定。•JavaScript中的变量可以直接使用,但建议先定义后使用,这样有利于提高程序的可读性。•JavaScript语句后面可以加分号,也可以不加,建议加上。14变量命名需要遵守以下六个规则1.变量命名必须以一个英文字母或是下划线为开头,也就是变量名第一个字符必须是A到Z或是a到z之间的字母或是“_”。2.变量名长度在0~255字符之间。3.除了首字符,其他字符可以使用任何字符、数字及下划线,但是不可以使用空格。4.不可以使用JavaScript的运算符号,例如:+,–,*,/等。5.不可以使用JavaScript用到的关键字。6.在JavaScript中,变量名大小写是有所区别的。15变量HTMLHEADSCRIPTLANGUAGE=JavaScriptvarWelcome=欢迎您!BR;vari=10;i=i+1;/SCRIPT/HEADBODYSCRIPTLANGUAGE=JavaScriptdocument.write(Welcome);document.write(i);/SCRIPT/BODY/HTML案例名称:使用变量程序名称:2.htm16声明数组•用new和Array关键字。–new代表建立一个新的对象。–Array是JavaScript内置的一个对象。由于JavaScript区分大小写,所以Array的首字母必须是大写。17使用数组HTMLBODYSCRIPTLANGUAGE=JavaScriptvarUserName=newArray(2);UserName[0]=Bill;UserName[1]=Bob;document.write(UserName[0]);document.write(br);document.write(UserName[1]);document.write(br);/SCRIPT/BODY/HTML案例名称:使用数组程序名称:3.htm184表达式与运算符•程序主要功能是运算,例如加、减、乘、除等基本操作。•算术运算符主要提供加、减、乘、除、取余等操作。HTMLBODYSCRIPTLANGUAGE=JavaScriptdocument.write(3*2);document.write(br);document.write(3/2);document.write(br);document.write(3%2);/SCRIPT/BODY/HTML案例名称:算术运算符程序名称:4.htm19逻辑运算符•逻辑运算符包括:与运算符“&&”、或运算符“||”和取反运算符“!”HTMLBODYSCRIPTLANGUAGE=JavaScriptdocument.write(true&&false);document.write(br);document.write(false&&false);document.write(br);document.write(true||false);document.write(br);document.write(!false);/SCRIPT/BODY/HTML案例名称:逻辑运算符程序名称:5.htm20字符串运算符的使用方法HTMLBODYSCRIPTLANGUAGE=JavaScriptvara=网页编程;varb=你好,;a+=b;document.write(a);/SCRIPT/BODY/HTML案例名称:字符串运算符程序名称:6.htm21条件表达式HTMLBODYSCRIPTLANGUAGE=JavaScripta=(43)?5:7;b=(43)?5:7;document.write(a);document.write(br);document.write(b);/SCRIPT/BODY/HTML案例名称:条件表达式程序名称:7.htm225JavaScript语句分类JavaScript提供的语句可以分为以下4大类:1.条件和分支语句if…else语句,switch语句。2.循环语句for语句,while语句,do…while语句,break语句和continue语句。3.对象操作语句new,this和with。4.注释语句“//”或“/**/”。23控制语句之条件语句if语句案例名称:if语句程序名称:8.htmSCRIPTLANGUAGE=JavaScriptvariHour=13;if(iHour12){document.write(早上好!);}else{document.write(下午好!);}/SCRIPT24switch语句案例名称:switch语句程序名称:9.htmSCRIPTLANGUAGE=JavaScriptvarval=;vari=5;switch(i){case3:val=三;break;case4:val=四;break;case5:val=五;break;default:val=不知道;}document.write(val);/SCRIPT25流控制语句之循环语句for语句的基本语法:for(初始化部分;条件部分;更新部分){语句块}for语句26for语句SCRIPTLANGUAGE=JavaScriptvariSum=0;for(vari=0;i=100;i++){iSum+=i;}document.write(iSum);/SCRIPT案例名称:for语句程序名称:10.htm27while语句SCRIPTLANGUAGE=JavaScriptvariSum=0;vari=0;while(i=100){iSum+=i;i++;}document.write(iSum);/SCRIPT案例名称:while语句程序名称:11.htm28break语句SCRIPTLANGUAGE=JavaScriptfor(i=1;i20;i++){if(i%5==0){break;}document.write(i+br);}/SCRIPT案例名称:break语句程序名称:
本文标题:JavaScript 快速入门资料
链接地址:https://www.777doc.com/doc-3600548 .html