1.JavaScript简介
1.1.JavaScript由来
JavaScript 是属于网络的脚本语言!JavaScript 被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。JavaScript 是因特网上最流行的脚本语言。
注: 1.javascript运行必须依赖于宿主环境语言,即页面语言HTML。
2.是解释型的语言,解释型:不需要编译,解释器程序会每读取一条语句就执行。运
行速度慢,JavaScript是基于对象和事件的脚本语言。
1.2.JavaScript特点
1.安全性(不允许直接访问本地硬盘),它可以做的就是信息的动态交互。
2.跨平台性。(只要是可以解释Js的浏览器都可以执行,和平台无关。)
1.3.JavaScript与Java不同
1.JS是基于对象,Java是面向对象。
2.JS只需解释就可以执行,Java需要先编译成字节码文件,再执行。
3.JS是弱类型,Java是强类型。javascript声明变量不需要明确是何种数据类型,任
何的变量都是使用一个关键字var去声明即可,变量类型取决于存储的数据的类型。
1.4.JavaScript内容
尽管 ECMAScript 是一个重要的标准,但它并不是 JavaScript 唯一的部分,一个完整的JavaScript 实现是由以下 3 个不同部分组成的:
目前我们学习JavaScript也就是需要学习:
JavaScript语法基础
使用JS操作网页(DOM)
使用JS操作浏览器(BOM)
1.5.体验JavaScript
javascript常用的函数:
alert("显示的内容..") ; 弹出框
document.write("数据") ; //向页面输出数据...
2.JavaScript基础
2.1.语法
2.1.1.引入方式与引入位置
向HTML页面插入JavaScript的主要方法,就是使用中。
2.使用script标签的src属性引入一个js文件。(方便后期维护,扩展)
例:
注:规范中script标签中必须加入type属性。
内部
window.document.write("hello,world");
外部
html文件
JavaScript文件
JavaScript代码
关闭,而不能这样关闭。否则没有任何错误信息,但是没有运行结果。
2.1.2.区分大小写
与 Java 一样,变量、函数名、运算符以及其他一切东西都是区分大小写的。
比如:
变量 test 与变量 TEST 是不同的。
2.1.
3.注释
Java: // /* */ /** */
HTML:
CSS: /* */
JavaScript:
有两种类型的注释:
单行注释以双斜杠开头(//)
多行注释以单斜杠和星号开头(/*),以星号和单斜杠结尾(*/)
2.2.常用函数
window.alert() 或写为 alert() :显示一个提示框显示内容。
window.document.write() :在网页的当前位置处写内容。
2.3.变量
变量是弱类型的
与 Java不同,ECMAScript 中的变量无特定的类型,定义变量时只用 var 运算符,可以将它初始化为任意值。
因此,可以随时改变变量所存数据的类型(尽量避免这样做)。
例子
var color = "red";
var num = 25;
var visible = true;
ECMAScript 中的变量是用 var 运算符(variable 的缩写)加变量名定义的。例如:var test = "hi";
在这个例子中,声明了变量 test,并把它的值初始化为 "hi"(字符串)。
每个变量仅仅是一个用于保存值的占位符而已。定义变量时要使用var操作符(var是关键字),后跟变量名
var message;
这行代码定义了一个名为message的变量,该变量可以用来保存任何值,也可以直接初始化变量。
var message ="hi";
ECMAScript 中的变量无特定的类型,定义变量时只用 var 运算符,可以将它初始化为任意值。
同时,可以随时改变变量所存数据的类型(尽量避免这样做)。
在ECMAScript是有效的,但是不建议这样使用。使用细节:
1、var关键字在定义变量的时候可以省略不写
2、变量名可以重复,后面的将覆盖前面的变量
3、变量的类型取决于值的类型
一条语句定义多个变量。
2.4.数据类型
2.4.1.typeof操作符
ECMASCRIPT 中有4种基本数据类型:
Undefined, Boolean,Number和String Typeof typeof c
关键字typeof可以获取一个变量的类型。
类型的总结:
所有的数值都是number类型
字符和字符串都是string类型
布尔是boolean类型
如果一个变量没有初始化值的时候,其类型为undefined类型。表示没有定义。
使用细节:
浮点数:
要定义浮点值,必须包括小数点和小数点后的一位数字(例如,用 1.0 而不是 1)。这被看作浮点数字面量。例如:
由于保存浮点数需要的内存空间是保存正数值的两倍,因此ECMAScrip会将浮点数值转换为整数值。如果小数点后没有跟任何数字和浮点数本身就是一个整数就会被转换为整数。
转换成数字
ECMAScript 提供了两种把非数字的原始值转换成数字的方法,即parseInt() 和parseFloat()。只有对 String 类型调用这些方法,它们才能正确运行;对其他类型返回的都是 NaN。
在判断字符串是否是数字值前,parseInt() 和 parseFloat() 都会仔细分析该字符串。
parseInt() 方法首先查看位置 0 处的字符,判断它是否是个有效数字;如果不是,该方法将返回 NaN,不再继续执行其他操作。但如果该字符是有效数字,该方法将查看位置 1 处的字符,进行同样的测试。这一过程将持续到发现非有效数字的字符为止,此时parseInt() 将把该字符之前的字符串转换成数字。
例如,如果要把字符串 "12345red" 转换成整数,那么 parseInt() 将返回
字符串中包含的数字字面量会被正确转换为数字,比如 "0xA" 会被正确转换为数字
isNaN
2.5.运算符(operator)
2.5.1.算术
加法运算符
加法运算符由加号(+)表示:
ECMAScript 中的加法也有一些特殊行为:
某个运算数是 NaN,那么结果为 NaN。
字符串拼接
如果两个运算数都是字符串,把第二个字符串连接到第一个上。
如果只有一个运算数是字符串,把另一个运算数转换成字符串,结果是两个字符串连接成的字符串。
例如:
var result = 5 + 5; //两个数字
alert(result); //输出 "10"
var result2 = 5 + "5"; //一个数字和一个字符串
alert(result); //输出 "55"
注意:
注意:变量是布尔类型的时候,true=1, false=0;
乘法运算符
乘法运算符由星号(*)表示,用于两数相乘。
ECMAScript 中的乘法语法与 Java语言中的相同:
注释:如果运算数是数字,那么执行常规的乘法运算,即两个正数或两个负数为正数,两个运算数符号不同,结果为负数。
除法运算符
除法运算符由斜杠(/)表示,用第二个运算数除第一个运算数:
var iResult = 88 /11;
注意:如果两个整数相除不能整数的时候结果还是小数。
2.5.2.比较
比较运算符小于、大于、小于等于和大于等于执行的是两个数的比较运算
var bResult1 = 2 > 1 //true
var bResult2 = 2 < 1 //false
比较数字和字符串
var bResult = "25" < "3";
alert(bResult); //输出 "true"
上面这段代码比较的是字符串 "25" 和 "3"。两个字符串在比较的时候比较的是两个字符串对应的字符顺序.
注意:如果字符串与比较,会把字符串转成数字再进行比较。
字符串与字符串的比较规则是:
情况1:能找到对应位置上的不同字符,那么就比较第一个不同字符的大小。
情况2:不能找到对应位置上的不同字符,这时候比较的是两个字符串的长度。document.write("190字符串大于19字符串吗?"+("190">"19")+"
"); //字符串与字符串比较
如果把某个运算数改为数字,那么结果就不一样了:
var bResult = "25" < 3;
alert(bResult); //输出 "false"
这里,字符串 "25" 将被转换成数字 25,然后与数字 3 进行比较,结果不出所料。
无论何时比较一个数字和一个字符串,ECMAScript 都会把字符串转换成数字,然后按照数字顺序比较它们。
2.5.
3.逻辑运算符
&& 与
|| 或
! 非
逻辑 AND 运算符
在 ECMAScript 中,逻辑 AND 运算符用双和号(&&)表示:
var bTrue = true;
var bFalse = false;
var bResult = bTrue && bFalse;
与 Java 中的逻辑 AND 运算相似,ECMAScript 中的逻辑 AND 运算也是简便运算,即如果第一个运算数决定了结果,就不再计算第二个运算数。对于逻辑 AND 运算来说,如果第一个运算数是 false,那么无论第二个运算数的值是什么,结果都不可能等于 true。
逻辑 OR 运算符
与逻辑 AND 运算符一样,逻辑 OR 运算也是简便运算。对于逻辑 OR 运算符来说,如果第一个运算数值为 true,就不再计算第二个运算数。
逻辑运算符NOT。
在 ECMAScript 中,逻辑 NOT 运算符与Java 中的逻辑 NOT 运算符相同,都由感叹号(!)表示。
2.5.4.赋值运算符
简单的赋值运算符由等号(=)实现,只是把等号右边的值赋予等号左边的变量。
例如:
var iNum = 10;
复合赋值运算是由乘性运算符、加性运算符或位移运算符加等号(=)实现的。这些赋值运算符是下列这些常见情况的缩写形式:
var iNum = 10;
iNum = iNum + 10;
可以用一个复合赋值运算符改写第二行代码:
var iNum = 10;
iNum += 10;
每种主要的算术运算以及其他几个运算都有复合赋值运算符:
乘法/赋值(*=)
除法/赋值(/=)
取模/赋值(%=)
加法/赋值(+=)
减法/赋值(-=)
2.5.5.三目
运算符是 ECMAScript 中功能最多的运算符,它的形式与 Java 中的相同。
variable = boolean_expression ? true_value : false_value;
该表达式主要是根据 boolean_expression 的计算结果有条件地为变量赋值。如果Boolean_expression 为 true,就把 true_value 赋给变量;如果它是 false,就把 false_value 赋给变量。
例如:
var iMax = (iNum1 > iNum2) ? iNum1 : iNum2;
在这里例子中,iMax 将被赋予数字中的最大值。表达式声明如果 iNum1 大于 iNum2,则把 iNum1 赋予 iMax。但如果表达式为 false(即 iNum2 大于或等于 iNum1),则把 iNum2 赋予 iMax。
2.6.流程控制语句
2.6.1.判断
判断语句
if 语句的语法:
if (condition) statement1 else statement2
如果条件计算结果为 true,则执行 statement1;如果条件计算结果为 false,则执行statement2。
注意:
判断的条件会发生自动类型转换:
number:如果非0为true,0为false
string:如果非null或非空为true,否则为false
undefined:false
NaN: false
对象类型:非null为true,否则为false。
2.6.2.选择
switch 语句的语法:
switch (expression)
case value: statement;
break;
case value: statement;
break;
case value: statement;
break;
case value: statement;
break;
...
case value: statement;
break;
default: statement;
每个情况(case)都是表示“如果 expression 等于 value,就执行statement”。
关键字 break 会使代码跳出 switch 语句。如果没有关键字 break,代码执行就会继续进入下一个 case。
关键字 default 说明了表达式的结果不等于任何一种情况时的操作(事实上,它相对于else 从句)。
ECMAScript 和 Java 中的 switch 语句
ECMAScript 和 Java 中的 switch 语句有两点不同。在 ECMAScript 中,switch 语句可以用于字符串,而且能用不是常量的值说明情况:
1、基本数据类型都可以传递给switch case语句。
2、case语句可以是表达式特殊之处:
1. 在javascript中case后面可以跟常量与变量还可以跟表达式。
function test6() {
var color = "xx";
var value1 = "red", value2 = "green";
switch(color) {
case value1:
alert("红色");
break;
case value2:
alert("绿色");
break;
default:
alert("执行默认default");
}
}
这里,switch 语句用于字符串 sColor,声明 case 使用的是变量 BLUE、RED 和GREEN,这在 ECMAScript 中是完全有效的。
练习:
2.6.
3.循环
while 语句
while 语句是先测试循环。这意味着退出条件是在执行循环内部的代码之前计算的。因此,循环主体可能根本不被执行。
它的语法如下:
while (expression) statement
例子:
var i = 0;
while (i < 10) {
i += 2;
}
do-while 语句
do-while 语句是后测试循环,即退出条件在执行循环内部的代码之后计算。这意味着在计算表达式之前,至少会执行循环主体一次。
它的语法如下:
do {statement} while (expression);
例子:
var i = 0;
do {i += 2;}
while (i < 10);
for 语句
for 语句是前测试循环,而且在进入循环之前,能够初始化变量,并定义循环后要执行的代码。
它的语法如下:
for (initialization; expression; post-loop-expression) statement
注意:post-loop-expression 之后不能写分号,否则无法运行。
例子:
iCount = 6;
for (var i = 0; i < iCount; i++) {
alert(i);
}
这段代码定义了初始值为 0 的变量 i。只有当条件表达式(i < iCount)的值为 true 时,才进入 for 循环,这样循环主体可能不被执行。如果执行了循环主体,那么将执行循环后表达式,并迭代变量 i。
for循环中不会有局部变量,都是全局的变量。
2.6.4.for in语句
for 语句是严格的迭代语句,用于枚举对象的属性或者遍历一个数组的元素。
它的语法如下:
for (property in expression) statement
例子:
for (sProp in window) {
alert(sProp);
}
这里,for-in 语句用于显示 window 对象的所有属性。
for-in语句的作用:
1. 可以用于遍历数组的元素。注意:使用for-in语句遍历数组元素的时候遍历出来是数组的下标。
2. 可以用于遍历对象的所有属性数据。注意:使用for-in语句遍历对象的属性的时候,遍历出来的是对象的属性名。
var arr = [12,13,19,15,16];
for-in语句遍历数组元素
for(var index in arr){
document.write(arr[index]+",");
}
普通的for循环遍历数组的元素
for(var index = 0 ; index document.write(arr[index]+","); } function Person(id , name){ this.id = id; https://www.doczj.com/doc/45156121.html, = name; } var p = new Person(110,"狗娃"); for(var property in p){ document.write(p[property]+","); } 2.6.5.With语句 wth语句的作用:有了With 语句,在存取对象属性和方法时就不用重复指定参考对象。格式: with(obj){ 操作obj的属性语句; } with语句:有了With 语句,在存取对象属性和调用方法时就不用重复指定对象。 格式: with(对象){ } with(document){ for(var i = 0 ; i<5; i++){ for(var j =0 ; j<=i ; j++){ write("* "); } write(" } write("
");
");
}
function Person(id , name){
this.id = id;
https://www.doczj.com/doc/45156121.html, = name;
}
//创建一个对象
var p = new Person(110,"狗娃"); with(p){
document.write("编号:"+ p.id);
document.write("姓名:"+ name); }
第 1 章 JavaScript 语言入门 1 为什么学习 JavaScript
提要:Javascript 是学习脚本语言的首选。她兼容性好,绝大多数浏览器均支持 Javascript,而且她功能强大,实现简单方便,入门简单,即使是程序设计新手也可以非常 快速容易地使用 JavaScript 进行简单的编程。
Javascript 是由 Netscape 公司创造的一种脚本语言。为便于推广,被定为 javascript,但 是 javascript 与 java 是两门不相干的语言, 作用也不一样。 作为一门独立的编程语言, javascript 可以做很多的事情,但它最主流的应用还是在 Web 上——创建动态网页(即网页特效)。 Javascript 在网络上应用广泛, 几乎所有的动态网页里都能找到它的身影。 目前流行的 AJAX 也是依赖于 Javascript 而存在的。 Javascript 与 Jscript 也不是一门相同的语言, Jscript 和 vbscript 是微软开发的两种脚本语 言,微软,Netscape 公司以及其他语言开发商为减少 web 开发者的兼容麻烦,所以成立 ECMA , 该组 织 专 门制定 脚 本 语 言的 标 准 和规范 。 ECMA 制 定 的标 准脚 本 语 言 叫做 ECMAScript,Javascript 符合 ECMA 的标准,其实 Javascript 也可以叫做 ECMAScript. Jscript 也 ECMA 的标准, 但用户较少。vbscript 仅局限在微软的用户, Netscape 不支持。 概括地说,JavaScript 就是一种基于对象和事件驱动,并具有安全性能的脚本语言,脚 本语言简单理解就是在客户端的浏览器就可以互动响应处理程序的语言, 而不需要服务器的 处理和响应,当然 JavaScript 也可以做到与服务器的交互响应,而且功能也很强大。而相对 的服务器语言像 asp https://www.doczj.com/doc/45156121.html, php jsp 等需要将命令上传服务器,由服务器处理后回传处理结 果。对象和事件是 JavaScript 的两个核心。 JavaScript 可以被嵌入到 HTML 文件中,不需要经过 Web 服务器就可以对用户操作作 出响应,使网页更好地与用户交互;在利用客户端个人电脑性能资源的同时,适当减小服务 器端的压力,并减少用户等待时间。
2 将 JavaScript 插入网页的方法
与在网页中插入 CSS 的方式相似,使用
language="javascript"表示使用 JavaScript 脚本语言,脚本语言还有 vbscript、 jsscript 等,如果没有 language 属性,表示默认使用 JavaScript 脚本。其中的...就是代 码的内容。例如:
JavaScript/jQuery、HTML、CSS 构建Web IM 远程及时聊天通信程序 这篇文章主要介绍用JavaScript和jQuery、HTML、CSS以及用第三方聊天JavaScript(jsjac)框架构建一个BS Web的聊天应用程序。此程序可以和所有连接到Openfire服务器的应用进行通信、发送消息。如果要运行本程序还需要一个聊天服务器Openfire,以及需要用到Http方式和Openfire通信的第三方库(JabberHTTPBind)。 JabberHTTPBind是jabber提供的XMPP协议通信的Http bind发送的形式,它可以完成WebBrowser和Openfire建立长连接通信。主要通信流程如下图所示: 用户A通过JavaScript jsjac.js库发送一条消息到JabberHTTPBind这个Servlet容器,然后JabberHTTPBind的Servlet容器会向Openfire发送XMPP协议的XML报文。Openfire Server接收到报文后解析,然后发送给指定的用户B。JabberHTTPBind获取到Openfire Server发送的数据后,解析报文向当前Servlet容器中的链接的Session中找到指定的用户再发送数据给用户B。 WebBrowser端用的是jsjac和JabberHTTPBind建立的连接,所有数据都要经过JabberHTTPBind解析/转换发送给Openfire。 先上张图看看效果,呵呵~这里是用户hoojo和girl的聊天画面,双方在进行互聊……
可以发送表情、改变字体样式(对方界面也可以看到你的字体样式),同时右侧是显示/收缩详情的信息 收缩详情 聊天界面部分截图 用户登录、注册,sendTo表示你登录后向谁发送聊天消息、并且建立一个聊天窗口
JavaScript笔试必考题 答案在最后 1) Output------? a)44 b)8 c)4 d)Error output 2) a)Quality b)Q,u,a,l,i,t,y,P,o,i,n,t,T,e,c,h,n,o,l,o,g,i,e,s c)Qualiyt,Point,Technologies d)QualityPointTechnologies 3)Is it possible to nest functions in JavaScript? a)True b)False 4)
a)get code name of the browser of a visitor b)set code name of the browser of a visitor c)None of the above 5)Which of the following is true? a)If onKeyDown returns false,the key-press event is cancelled. b)If onKeyPress returns false,the key-down event is cancelled. c)If onKeyDown returns false,the key-up event is cancelled. d)If onKeyPress returns false,the key-up event is canceled. 6)Scripting language are a)High Level Programming language b)Assembly Level programming language c)Machine level programming language 7)Which best explains getSelection()? a)Returns the VALUE of a selected OPTION. b)Returns document.URL of the window in focus. c)Returns the value of cursor-selected text d)Returns the VALUE of a checked radio input. 8)
潍坊科技学院 JavaScript课程设计 报告书 设计题目基于javascript的电子商务网站开发 专业班级11软件一 学生姓名江京翔 学号201101080002 指导教师陈凤萍 日期2012.12.24~2012.1.11 成绩
课程设计任务书 院系:软件学院专业:软件技术班级:11软1 学号:201101080002 一、课程设计时间 2012年12月24日至2013年1月11日,共计3周。 二、课程设计内容 使用html+javascript+css 完成以下任务: 1、能够熟练使用css结合html实现网页布局。 2、熟练使用文档对象模型和事件驱动,能够很好的实现web表单的交互式操作。 3、熟练使用javascrip中的对象,实现网页的动态效果。 三、课程设计要求 1. 课程设计质量: ?贯彻事件驱动的程序设计思想,熟练使用javascript中的对象,实现网页特效。 ?网页设计布局合理,色彩搭配合理,网页操作方便。 ?设计过程中充分考虑浏览器兼容等问题,并做适当处理。 ?代码应适当缩进,并给出必要的注释,以增强程序的可读性。 2. 课程设计说明书: 课程结束后,上交课程设计报告书和相关的网页。课程设计报告书的格式和内容参见提供的模板。 四、指导教师和学生签字 指导教师:学生签名:江京翔 五、教师评语:
基于javascript的电子商务网站开发 摘要 JavaScript是开发WEB应用程序不可或缺的一种语言,无论是为web页面增加交互性还是创建整个应用程序,如果没有Javascript,今天的web就不是现在这个样子了。JavaScript是具有正式规范的基于标准语言;然而,正如任何一个web开发人员所告诉你的那样,几乎每个web浏览器对这个规范的解释都不同。 本网站充分的结合了HTML与CSS的结合充分显示了网站的动态效果,是客户与网站能够充分的结合,进行信息的交换信息不断的进行更新。 基于新闻管理网站,国外新闻页面更具有代表性,是网站最标准型之一,通过Javascript 脚本的交互式该页面更好与其他的页面相互结合。 同时通常页面的下载是按照代码的排列顺序,而表格布局代码的排列代表从上向下,从左到右,无法改变。而通过CSS控制,您可以任意改变代码的排列顺序,比如将重要的右边内容先加载出来。 关键字:节假日、日历、Javascript脚本
Javascript简介 (2) Javascript简介 (2) 简单的Javascript入门示例 (4) 编写Javascript 代码 (5) 语句(Statements) (5) 语句块(Blocks) (6) 注释(Comments) (7) 表达式(Expressions) (8) 赋值和等于(Assignments and Equality) (9) Javascript常用运算符(Operators) (10) 算术运算符 (10) 逻辑运算符 (11) 赋值运算符 (12) Javascript 循环语句(Javascript Loop Statements) (12) 使用for 循环语句 (13) 使用for...in 循环语句 . (15) 使用while 和do...while 循环语句 (17) 使用break 和continue 语句 (20) Javascript写在哪里 (23) Javascript在
之间 (23)Javascript在
之间 (24) Javascript放在外部文件里 (25) Javascript变量(Javascript Variables) (26) 什么是变量? (26) 变量的声明(Declaring Variables) (26) 变量的命名规则 (27) Javascript条件语句(Javascript Conditional Statements) (27) 单项条件结构(if条件语句) (28) 双向条件结构(if...else条件语句) (29) 多项条件结构(switch条件语句) (31) Javascript保留字(Javascript Reserved Words) (32) Javascript未来保留字(Javascript Future Reserved Words) (33) Javascript简介 Javascript简介习题1 一、单选题 1、向HTML 页面嵌入JavaScript 脚本描述正确的是( C)。 A.JavaScript 脚本只能放置在HTML 页面中
与中 B.JavaScript 脚本可以放置在HTML 页面中的任何地方 C.JavaScript 脚本必须被标签对所包含 D. JavaScript 脚本必须被