您的当前位置:首页实验五 JAVASCRIPT 2

实验五 JAVASCRIPT 2

2024-04-15 来源:世旅网
实验五 JAVASCRIPT

实验内容

1. JAVASCRIPT基础语法 2. JAVASCRIPT实现日历

3. JAVASCRIPT控制COOKIE 4. 运行2个JAVASCRIPT程序

首先确认在本地计算机是否安装了网页编辑软件,如DreamWeaver。若无,则安装,序列号在”安装密码.txt”文件中。

内容一:JAVASCRIPT概念

Javascript是一种由Netscape的LiveScript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如Perl,遗留的速度问题,为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证,由于网络速度相当缓慢,只有28.8kbps,验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了Javascript,提供了数据验证的基本功能。 变量 常用类型

Object:对象 Array:数组 Number:数

Boolean:布尔值,只有true和false两个值,是所有类型中占用内存最少的 null:一个空值,唯一的值是null,表空引用 undefined:没有定义或赋值的变量 NaN:非数字类型 命名形式

一般形式是: var <变量名表>;

其中,var是javascript的保留字,表面接下来是变量说明,变量名表是用户自定义标识符,变量之间用逗号分开。和C++等程序不同,在javascript中,变量说明不需要给出变量的数据类型。此外,变量也可以不说明而直接使用。 事件

用户与网页交互时产生的操作,称为事件。事件可以由用户引发,也可能是页面发生改变,甚至还有你看不见的事件(如Ajax的交互进度改变)。绝大部分事件都由用户的动作所引发,如:用户按鼠标的按键,就产生click事件,若鼠标的指针在链接上移动,就产生mouseover事件等等。在JavaScript中,事件往往与事件处理程序配套使用。

而对事件的处理,W3C的方法是用addEventListener()函数,它有三个参数:事件,引发的函数,是否使用事件捕捉。为了安全性,建议将第三个参数始终设置为false

传统的方法就是定义元素的on„事件,它就是W3C的方法中的事件参数前加一个“on”。而IE的事件模型使用attachEvent和dettachEvent对事件进行绑定和删除。JavaScript中事件还分捕获和冒泡两个阶段,但是传统绑定只支持冒泡事件。 对象

JavaScript的一个重要功能就是面向对象的功能,通过基于对象的程序设计,可以用更直观、模块化和可重复使用的方式进行程序开发。

一组包含数据的属性和对属性中包含数据进行操作的方法,称为对象。比如要设定网页的背景颜色,所针对的对象就是document,所用的属性名是bgcolor,如document.bgcolor=\"blue\",就是表示使背景的颜色为蓝色。 内置对象

 JavaScript 字符串(String)对象

字符串是 JavaScript 的一种基本的数据类型。需要注意的是,JavaScript 的字符串不可变(immutable),String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法,返回的是全新的字符串,而不是修改原始字符串。 String 对象的 length 属性声明了该字符串中的字符数。

String 类定义了大量操作字符串的方法,一般分为这样几类:查找子字符串、截取,分割和拼接字符串、匹配正则表达式、改变字符串样式等。  JavaScript Date(日期)对象

Date 对象用于处理日期和时间,Date 对象会自动把当前日期和时间保存为其初始值。 Date 对象的大部分方法是以下几类:

getXXX:获取 年、月、日、时、分、秒、等等。 setXXX:设置 年、月、日、时、分、秒、等等。 toXXXString:转成一定格式的字符串。  JavaScript Array(数组)对象

数组对象的作用是:使用单独的变量名来存储一系列的值。 数组的常用属性是:length,代表了这个数组中元素的个数。

数组的常用方法分这么几类:排序、添加和删除元素、拼接另一个数组、转成字符串。其中添加元素和移除元素的几个方法还有模拟堆栈或队列这些数据结构的作用。  JavaScript Boolean(逻辑)对象

Boolean(逻辑)对象用于将非逻辑值转换为逻辑值(true 或者 false)。 在 JavaScript 中,布尔值是一种基本的数据类型。Boolean 对象是一个将布尔值打包的布尔对象。Boolean 对象主要用于提供将布尔值转换成字符串的 toString() 方法。当调用 toString() 方法将布尔值转换成字符串时(通常是由 JavaScript 隐式地调用),JavaScript 会内在地将这个布尔值转换成一个临时的 Boolean 对象,然后调用这个对象的 toString() 方法。

 JavaScript Math(算数)对象

Math(算数)对象的作用是:执行常见的算数任务。

Math 对象并不像 Date 和 String 那样是对象的类,因此没有构造函数 Math(),像 Math.sin() 这样的函数只是函数,不是某个对象的方法。您无需创建它,通过把 Math 作为对象使用就可以调用其所有属性和方法。(相当于静态类和静态方法)

Math 对象的常用属性都是数学相关的常量属性,如圆周率π、2的平方根,算数常量e(自然对数的底数,约等于2.718)。

Math 对象中最常用的方法有这样一些:向上(向下)取整、四舍五入取整、随机数、

返回2个数中的大数或小数。 JavaScript RegExp 对象 什么是 RegExp?

RegExp 是正则表达式的缩写。当您检索某个文本时,可以使用一种模式来描述要检索的内容。RegExp 就是这种模式。简单的模式可以是一个单独的字符。更复杂的模式包括了更多的字符,并可用于解析、格式检查、替换等等。您可以规定字符串中的检索位置,以及要检索的字符类型,等等。

这个知识点,相对还是比较繁杂的,想熟练掌握是需要花费一些功夫的,具体请看 JS 手册。

 JavaScript Global 对象 这是一个固有对象,目的是把所有全局方法集中在一个对象中。Global 对象不能用 new 运算符创建。它在 Scripting 引擎被初始化时创建,并立即使其方法和属性可用。 属性:Infinity 属性 | NaN 属性

方法:escape 方法 | eval 方法 | isFinite 方法 | isNaN 方法 | parseFloat 方法 | parseInt 方法 | unescape 方法

Javascript加入网页有两种方法:直接方式和引用方式。 直接方式

直接调用分为两种形式:代码块和代码行 代码行引用:

aa

这种方式应用比较简单,直观,多用于测试 代码块:

这是最常用的方法,大部分含有Javascript的网页都采用这种方法,例如:

在这个例子中,我们可看到一个新的标签:,而

其中的Url就是程序文件的地址。同样的,这样的语句可以放在HTML文档头部或主体的任何部分。如果要实现“直接插入方式”中所举例子的效果,可以首先创建一个Javascript源代码文件“Script.js”,其内容如下:

document.write(\"这是Javascript!采用直接插入的方法!\"); 在网页中可以这样调用程序:

也可以同时在导入文件时制定javascript的版本,例如:

注意:凡是指定了src属性的script标签里的内容都会被忽略。 示例一:

示例二:打开一个页面的同时弹出一个提示窗口 示例三:设置页面颜色

内容二:JAVASCRIPT控制日历,在调试时注意去掉红色注释部分

javascripttest 日 内容三:JAVASCRIPT控制COOKIE

cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。

cookie 是有大小限制的,每个 cookie 所存放的数据不能超过4kb,如果 cookie 字符串的长度超过4kb,则该属性将返回空字符串。

由于 cookie 最终都是以文件形式存放在客户端计算机中,所以查看和修改 cookie 都是很方便的,这就是为什么常说 cookie 不能存放重要信息的原因。

每个 cookie 的格式都是这样的:=<值>;名称和值都必须是合法的标示符。 cookie 是存在 有效期的。在默认情况下,一个 cookie 的生命周期就是在浏览器关闭的时

候结束。如果想要 cookie 能在浏览器关掉之后还可以使用,就必须要为该 cookie 设置有效期,也就是 cookie 的失效日期。

alert(typeof document.cookie) 结果是 string,曾经我以为是array,还闹过笑话...囧

cookie 有域和路径这个概念。域就是domain的概念,因为浏览器是个注意安全的环境,所以不同的域之间是不能互相访问 cookie 的(当然可以通过特殊设置的达到 cookie 跨域访问)。路径就是routing的概念,一个网页所创建的 cookie 只能被与这个网页在同一目录或子目录下得所有网页访问,而不能被其他目录下得网页访问(这句话有点绕,一会看个例子就好理解了)。

其实创建cookie的方式和定义变量的方式有些相似,都需要使用 cookie 名称和 cookie 值。同个网站可以创建多个 cookie ,而多个 cookie 可以存放在同一个cookie 文件中。

cookie的读取操作

function getCookie(c_name){ if (document.cookie.length>0){ //先查询cookie是否为空,为空就return \"\" c_start=document.cookie.indexOf(c_name + \"=\") //通过String对象的indexOf()来检查这个cookie是否存在,不存在就为 -1 if (c_start!=-1){ c_start=c_start + c_name.length+1 //最后这个+1其实就是表示\"=\"号啦,这样就获取到了cookie值的开始位置 c_end=document.cookie.indexOf(\";\ //其实我刚看见indexOf()第二个参数的时候猛然有点晕,后来想起来表示指定的开始索引的位置...这句是为了得到值的结束位置。因为需要考虑是否是最后一项,所以通过\";\"号是否存在来判断 if (c_end==-1) c_end=document.cookie.length return unescape(document.cookie.substring(c_start,c_end)) //通过substring()得到了值。想了解unescape()得先知道escape()是做什么的,都是很重要的基础,想了解的可以搜索下,在文章结尾处也会进行讲解cookie编码细节 } } return \"\" } 示例一 无标题文档 示例二,该例需要运行两次,第一次输入一个标识字符串确认,第二次在当前页面进行刷新 内容四:运行2个JAVAscipt程序

1. 坦克作战 或 雪花飞舞(http://www.schillmania.com/projects/snowstorm/) 2. 自找一个有趣的JAVASCIPRT程序,详细的对该程序的设计思想、代码说明、运行截图以及改进点的进行描述,提交实验报告。

因篇幅问题不能全部显示,请点此查看更多更全内容