实验3_JavaScript编程
javascript 的使用(实验报告)
实验七 Javascript的使用
学号 201114004 姓名王渝迪专业计算机科学与技术成绩
【实验目的】
Javascript的使用。
【实验内容】
1、熟悉Dreamweaver软件的环境；
2、会使用基本的Javascript语言进行简单的网页设计。
【实验步骤】
1，打开dreamaver，新建基本页命名文档名字；
2，单击站点，选择新建站点，因为不打算做动态网页所以选择最基本及好了，不用写服务器ip，也不用服务器技术。
最后选择要存储的文件夹，最好把所有图片也建一个文件夹；
3，做网页的时候可以是代码页面也可以是设计页面，还可以是拆分页面，在网页面写出自己想显示的内容；
3，将script的类型定义为javascript,以<!—开始
【实验结果】
加载后：
Mouseoverr：
Mouseout：
【实验心得和体会】
这次的实验，我用Javascript语言设置并实现了一些简单的功能，跟我们平时所做的编程语言也有很大的不同。
虽然根据老师所演示的例子以及老师课堂上所讲解的东西我完成了此次作品，但是要想更深一步去了解使用Javascript语言，这需要在接下来的学习过程中不断自己总计。
实验三JAVASCRIPT基础训练
1
3. 新建一个 HTML 网页，实现鼠标移动时，一行文字跟随鼠标移动；
return false; // 判断 30 天的月 if((month==4 || month==6 || month==9 || month==11)
&& day>30) return false; // 如果是 2 月，判断是否为润年 if(month==2) { if(year%400==0 || (year%4==0 && year%100!=0)) {
4
return true; } // 判断是否是日期，日期的格式为 1988-1-1 function isDate(date) {
// 查找分隔符 index1 = date.indexOf("-"); // 如果分隔符不存在，则不是合法的时间 if(index1 == -1)
return false; // 获取时间中的年 year = date.substring(0,index1); // 获取时间中的剩下部分 date = date.substring(index1+1); // 查找第二个分隔符 index1 = date.indexOf("-"); // 如果不存在第二个分隔符，则不是合法的时间 if(index1 == -1)
font-family: "华文彩云"; font-size: 44px; color: #6600FF; } --> </style> </head> <body> <h2 align="center" class="ss">欢 迎 注 册</h2> <form name="form1" action="yulei.html" method="post"
Javascript实训内容
Javascript实训内容实训1 javascript 基本操作实训目的：1．掌握HTML中编写javascript程序的基本操作2．掌握基本的编写工具实训内容：1、要求用户在文本框中输入用户名，提交时，若文本框为空，则取消提交（使用form对象的onSumbit事件）。
实训2 javascript 语言基本操作实训目的：1．掌握JavaScript的基本语法，包括数据类型、运算符、表达式等数据表示方式；实训内容：1、利用复选框让用户选择其爱好，输出用户所选的内容。
2、利用单选钮让用户选择其性别，输出用户所选的内容。
实训3 javascript基本语句的应用实训目的：1．掌握JavaScript的常用内置对象的作用、属性、方法的运用；2．掌握 JavaScript的程序流程控制语句的运用。
实训内容：利用隐藏控件，设计判断用户输入的验证码。
实训4 javascript函数的应用实训目的：掌握脚本自定义函数，掌握函数的调用方法。
实训内容：表格内容全选及反选；（自做1）自定义函数限制文字数量。
（自做2）实训5 BOM对象的应用实训目的：掌握window对象、document对象、History对象等。
实训内容1、在打开网页后弹出一个有宽200,高300的窗口,且在该网页关闭后，弹出的窗口也关闭。
2、实现右下角渐显的广告窗口（自做4）。
实训6 javascript控制页面样式实训目的：掌握javascript样式编程实训内容1、设计弹出式菜单。
2、实现无边框窗口（自做5）实训7 事件处理操作实训目的：掌握调用事件的方法掌握鼠标事件的应用实训内容菜单导航的实现（自做3）实训8 ajax技术的应用实训目的：熟练掌握AJAX无刷新技术实训内容：AJAX实现不刷新检索用户名是否存在。
（自做6）实训9 10 综合练习实训目的：掌握熟练处理表单数据、输出表单以及表单提交时数据合法性验证的能力实训内容：1利用下拉列表框实现网页跳转2设计多选下拉列表框，输出选中的内容。
JavaScript实验实训内容
JavaScript表达式和逻辑操纵语句的利用实验一一．实验目的把握JavaScript的变量；把握JavaScript的数据类型；把握JavaScript的运算符；把握JavaScript的逻辑操纵语句。
二．实验内容一、声明一个变量str，为其赋值"Hello World!"，显示该值；改变该变量值为"Hello China!"，然后再显示该值。
二、将1~10之间的奇偶数分开，页面呈现方式如下：3、任意输入一个年份，判定是不是为闰年。
实验二函数部份一．实验目的把握JavaScript的常常利用函数；二．实验内容编写一个函数，在页面上输出1~1000之间所有能同时被3，5，7整除的证书，并要求每行显示6个如此的数。
<html><head><script language=javascript><!--function IsThatNumber(x){return x%3==0 && x%5==0 && x%7==0;}METAMETAif">'; }return ret;}Last"></P><P>卡号：<INPUT type="text" name="mynumber" size="20" value="0000-0000-0000-0000"></P> <P><INPUT type="submit" value="发送"></P></FORM></BODY></HTML>1．设计3个按钮，当单击他们时别离使页面的背景色变成红、蓝和绿色。
实验3javascript编程
实验三JavaScript编程一、实验目的1．掌握JavaScript的基本语法；2．掌握JavaScript的常用内置对象的作用、属性、方法的运用；3．掌握JavaScript的程序流程控制语句的运用；4．理解Javascrip中对象的基本概念；5．掌握常用的Javascrip内置对象及其属性、方法等；6. 掌握Javascrip中事件处理的方法；7. 掌握BOM和DOM模型中的常见对象及其属性、方法；8. 掌握JQuery框架的基本应用。
二、实习题目1. 编写JavaScript程序实现“九九乘法表”。
2. 编写函数实现生成指定行数和列数的表格（行数和列数通过函数参数传递）。
3. 利用Date对象编写程序，判断并输出今天是开学的第几周，星期几。
4.编写程序，利用正则表达式输出待处理英文单词或词组的首字母。
如"blue idea"输出"bi"，"Asynchronous JavaScript And XML"输出"AJAX"(不包括引号)。
说明：所谓“首字母”包括两种情况：第一种是边界(开头)的单词字符，一种是空格之后的单词的第一个字母。
5. 设计一个网页，输入一串用英文逗号分隔的数字字符串。
编写程序，输出找出该组数中的最大、最小值、和。
并按从大到小排序后的输出结果（以逗号分隔）。
6. 要求用户在文本框中年份，点击判断按钮，用alert函数输出该年是否是闰年的结果。
<input type="text" name="txtYear"><input type="button" value="判断" onclick="testLeapYear()"><script>function testLeapYear (){//你的代码}</script>7. 利用复选框让用户选择其爱好，用alert对话框输出用户所选的内容。
HTML 实验3：JavaScript编程
信息学院实验报告
专业：软件工程班级：
姓名：学号：
实验3：JavaScript编程
实验设备：
PC机：Pentium IV 2.8G CPU；1G内存；120G硬盘
OS：Windows7
应用软件：IE10.0、Dreamweaver CS5.5、Notepad
实验目的：
1. 掌握JavaScript的基本语法；
2. 掌握DOM对象的使用；
3. 会应用所学JavaScript知识进行客户端的编程。
实验内容及要求：
1. 图像交互，在网页中放一幅图像，鼠标移到上面时显示另一幅，鼠标移开时显示原来那一幅。
图像下方放两个按钮：“增加”和“缩小”，点击“增加”按钮图像宽度与高度相应增加，点击“缩小”按钮图像宽度与高度相应减小。
2. 网页秒表，打开网页时用文本显示“当前日期：****年**月**日”，文本下面设计一只读文本框，标签为“当前时间：”，在文本框中显示当前的精确到秒的时间。
文本框下面为两个按钮，“开始计时”和“结束计时”，点击“开始计时”按钮，文本框中以秒计时，点击“结束计时”，停止计时。
3. 表格动态交互编辑。
在页面中设计3个文本框，添加相应的标签，用户分别输入行号、列号、单元格中的内容。
再设计一个按钮和三行三列的表格，合理布局，并在表格中添加适当的内容。
编写JavaScript程序，当点击按钮时，根据用户输入的行号、列号、内容修改表格中相应单元格的内容。
对用户输入的行号、列号进行有效性判断。
实验结果：
实验思考题：
DOM定位的有哪几种方式是什么？
①根据ID访问HTML元素
②利用节点关系访问HTML元素。
实验3_JavaScript编程
实验三 JavaScript编程一、实验目的1．掌握JavaScript的基本语法；2．掌握JavaScript的常用内置对象的作用、属性、方法的运用；3．掌握 JavaScript的程序流程控制语句的运用；4．理解Javascrip中对象的基本概念；5．掌握常用的Javascrip内置对象及其属性、方法等；6. 掌握Javascrip中事件处理的方法；7. 掌握BOM和DOM模型中的常见对象及其属性、方法；8. 掌握JQuery框架的基本应用。
二、实习题目1. 编写JavaScript程序实现“九九乘法表”。
<!DOCTYPE HTML PUBLIC "-编写函数实现生成指定行数和列数的表格（行数和列数通过函数参数传递）。
<!DOCTYPE HTML PUBLIC "-利用Date对象编写程序，判断并输出今天是开学的第几周，星期几。
<!DOCTYPE HTML PUBLIC"-编写程序，利用正则表达式输出待处理英文单词或词组的首字母。
如"blue idea"输出"bi"，"Asynchronous JavaScript And XML"输出"AJAX"(不包括引号)。
说明：所谓“首字母”包括两种情况：第一种是边界(开头)的单词字符，一种是空格之后的单词的第一个字母。
<form><input type="text" value="" id="tt"><input type="button" id="btn" value="begin" onclick="myfun()"></form><script type="text/javascript">var s=('tt');设计一个网页，输入一串用英文逗号分隔的数字字符串。
实验 javascript程序设计
实验 javascript程序设计实验 JavaScript 程序设计章节一、引言本章将介绍实验 JavaScript 程序设计的目的和概述。
1.1 目的本实验旨在帮助学生掌握 JavaScript 程序设计的基本概念和技巧，培养学生编写JavaScript程序并解决实际问题的能力。
1.2 概述本实验涵盖了 JavaScript 程序设计的基本知识，包括变量、数据类型、运算符、控制结构、函数等。
通过实例演示和练习，学生将学会如何使用 JavaScript 进行简单的程序设计。
章节二、JavaScript 程序设计基础本章将介绍 JavaScript 程序设计的基本概念和语法。
2.1 变量2.1.1 变量的定义和声明2.1.2 变量的赋值和使用2.1.3 变量的作用域2.2 数据类型2.2.1 数字型2.2.2 字符串型2.2.3 布尔型2.2.4 数组2.2.5 对象2.3 运算符2.3.1 算术运算符2.3.2 比较运算符2.3.3 逻辑运算符2.3.4 赋值运算符2.4 控制结构2.4.1 条件语句2.4.2 循环语句2.4.3 分支语句2.5 函数2.5.1 函数的定义和调用2.5.2 函数的参数和返回值2.5.3 函数的递归章节三、实践项目本章将介绍一些实际的 JavaScript 程序设计项目，并提供相应的实例和练习。
3.1 网页表单验证3.1.1 检查用户名和密码3.1.2 验证邮箱和方式号码3.2 图片轮播3.2.1 实现图片切换效果3.2.2 添加自动播放功能3.3 计算器3.3.1 实现加减乘除运算3.3.2 添加清除和回退功能章节四、附加内容1、本文档涉及附件本文档附带了一些实例代码和练习文件，作为读者学习和实践的参考材料。
2、本文所涉及的法律名词及注释本文涉及的法律名词及注释仅供参考，读者在实际运用中应遵守当地相关法律法规。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
实验三JavaScript编程一、实验目的1．掌握JavaScript的基本语法；2．掌握JavaScript的常用内置对象的作用、属性、方法的运用；3．掌握JavaScript的程序流程控制语句的运用；4．理解Javascrip中对象的基本概念；5．掌握常用的Javascrip内置对象及其属性、方法等；6. 掌握Javascrip中事件处理的方法；7. 掌握BOM和DOM模型中的常见对象及其属性、方法；8. 掌握JQuery框架的基本应用。
二、实习题目1. 编写JavaScript程序实现“九九乘法表”。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html lang="en"><head><meta http-equiv="Content-Type"content="text/html;charset=UTF-8"><title>Document</title></head><body><table ><tr><td></td></tr></table><script type="text/javascript">var x;var y;document.write("<table >");for(x=1;x<=9;x++){document.write("<tr>");for(y=1;y<=x;y++){document.write("<td>");document.write(x+"*"+y+"="+x*y);document.write("</td>");}document.write("</tr>");}document.write("</table>");</script></body></html>2. 编写函数实现生成指定行数和列数的表格（行数和列数通过函数参数传递）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>Document</title></head><body><script type="text/javascript">function myfun(x,y){var i;var j;document.write("<table border='1' > ");for (var i = 0; i <x ; i++) {document.write("<tr height='50px'>");f or (var j = 0; j <y ; j++) {document.write("<td width='200px'>");document.write("</td>");};document.write("</tr>");};document.write("</table>");}document.write(myfun(6,5));</script></body></html>3. 利用Date对象编写程序，判断并输出今天是开学的第几周，星期几。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>Document</title></head><body><script type="text/javascript">(function(){var startDay = new Date(2017,01,20);//根据指定的年月日时分秒设置开学时间为2017,1,20var startMs = startDay.getTime();//返回1970年至今的毫秒var startYear = startDay.getFullYear();//从Date对象以四位数字返回年份var startMonth = startDay.getMonth()+1;//从Date对象返回年份（0-11）var startDate = startDay.getDate();// 从Date对象返回一月中的某一天(1~31)var nowDay = new Date();var nowMs = nowDay.getTime();var nowYear = nowDay.getFullYear();var nowMonth = nowDay.getMonth()+1;var nowDate = nowDay.getDate();var startDays = parseInt(startMs/86400000);var nowDays = parseInt(nowMs/86400000);var totalDays = nowDays - startDays;var week = parseInt(totalDays/7)+1;var nowdate = nowDay.getDay();msg1 = "开学时间：" + startYear + " 年" + startMonth + " 月" + startDate + "日";document.write(msg1);document.write("<br>")msg2 ="现在时间：" + nowYear + " 年" + nowMonth + " 月" + nowDate + "日";document.write(msg2);document.write("<br>");msg3 = "第" + week + "周，星期" + nowdate;document.write(msg3);})();</script></body></html>4.编写程序，利用正则表达式输出待处理英文单词或词组的首字母。
如"blue idea"输出"bi"，"Asynchronous JavaScript And XML"输出"AJAX"(不包括引号)。
说明：所谓“首字母”包括两种情况：第一种是边界(开头)的单词字符，一种是空格之后的单词的第一个字母。
<form><input type="text" value="" id="tt"><input type="button" id="btn" value="begin" onclick="myfun()"></form><script type="text/javascript">var s=document.getElementById('tt');//var s="Qasdasd iasdf uasdf Yasd uasd Sdf hdf easfasf nsdf gdsafasf";function myfun(){var regex=/\b[A-Za-z]/g;var arr=s.value.match(regex);var str="";for(var i=0;i<arr.length;i++)str=str+arr[i];alert(str);</script>5. 设计一个网页，输入一串用英文逗号分隔的数字字符串。
编写程序，输出找出该组数中的最大、最小值、和。
并按从大到小排序后的输出结果（以逗号分隔）。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd"><html lang="en"><head><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><title>Document</title><script type="text/javascript">function fun(){var str=document.getElementById('in').value;var reg=/\d+/g;var num=str.match(reg);var sum=0;var max1=parseInt(num[0]);var min1=parseInt(num[0]);for (var j= 0; j< num.length; j++) {sum=sum+parseInt(num[j]);if (parseInt(num[j])<parseInt[num[0]]) { min1=num[j];}else{max1=num[j];}for(var i=0;i<num.length;i++){if(parseInt(num[i])>parseInt(num[i+1])) {temp=num[i];num[i]=num[i+1];num[i+1]=temp;}}}a.value=max1;b.value=min1;c.value=sum;bubble.value=num;}</script></head><body><form><label>输入数字：</label><input type="text" id="in"></br><input type="button" value="begin" onclick="fun()"> </br><label>最大值为：</label><input type="text" id="a" ></br><label>最小值为：</label><input type="text" id="b"></br><label>求和后为：</label><input type="text" id="c" ></br><label>排序后为：</label><input type="text" id="bubble" ></form></body></html>6. 要求用户在文本框中年份，点击判断按钮，用alert函数输出该年是否是闰年的结果。