实验3JavaScript编程.docx

实验3JavaScript编程.docx

《实验3JavaScript编程.docx》由会员分享，可在线阅读，更多相关《实验3JavaScript编程.docx（18页珍藏版）》请在冰豆网上搜索。

实验3JavaScript编程

实验三JavaScript编程

一、实验目的

1．掌握JavaScript的基本语法；

2．掌握JavaScript的常用内置对象的作用、属性、方法的运用；

3．掌握JavaScript的程序流程控制语句的运用；

4．理解Javascrip中对象的基本概念；

5．掌握常用的Javascrip内置对象及其属性、方法等；

6.掌握Javascrip中事件处理的方法；

7.掌握BOM和DOM模型中的常见对象及其属性、方法；

8.掌握JQuery框架的基本应用。

二、实习题目

1.编写JavaScript程序实现“九九乘法表”。

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

varx;

vary;

document.write（"

for（x=1;x<=9;x++）

{

document.write（"

for（y=1;y<=x;y++）

{

document.write（"

}

document.write（"

}

document.write（"

2.编写函数实现生成指定行数和列数的表格（行数和列数通过函数参数传递）。

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

functionmyfun（x,y）

{

vari;

varj;

document.write（""）;

for（vari=0;i

document.write（""）;

for（varj=0;j

document.write（""）;

document.write（""）;

};

document.write（""）;

};

document.write（""）;

}

document.write（myfun（6,5））;

3.利用Date对象编写程序，判断并输出今天是开学的第几周，星期几。

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

（

function（）{

varstartDay=newDate（2017,01,20）;

//根据指定的年月日时分秒设置开学时间为2017,1,20

varstartMs=startDay.getTime（）;//返回1970年至今的毫秒

varstartYear=startDay.getFullYear（）;

//从Date对象以四位数字返回年份

varstartMonth=startDay.getMonth（）+1;

//从Date对象返回年份（0-11）

varstartDate=startDay.getDate（）;

//从Date对象返回一月中的某一天（1~31）

varnowDay=newDate（）;

varnowMs=nowDay.getTime（）;

varnowYear=nowDay.getFullYear（）;

varnowMonth=nowDay.getMonth（）+1;

varnowDate=nowDay.getDate（）;

varstartDays=parseInt（startMs/86400000）;

varnowDays=parseInt（nowMs/86400000）;

vartotalDays=nowDays-startDays;

varweek=parseInt（totalDays/7）+1;

varnowdate=nowDay.getDay（）;

msg1="开学时间：

"+startYear+"年"+startMonth+"月"+startDate+"日";

document.write（msg1）;

document.write（"
"）

msg2="现在时间：

"+nowYear+"年"+nowMonth+"月"+nowDate+"日";

document.write（msg2）;

document.write（"
"）;

msg3="第"+week+"周，星期"+nowdate;

document.write（msg3）;

}）（）;

4.编写程序，利用正则表达式输出待处理英文单词或词组的首字母。

如"blueidea"输出"bi"，"AsynchronousJavaScriptAndXML"输出"AJAX"（不包括引号）。

说明：

所谓“首字母”包括两种情况：

第一种是边界（开头）的单词字符，一种是空格之后的单词的第一个字母。

vars=document.getElementById（'tt'）;

//vars="QasdasdiasdfuasdfYasduasdSdfhdfeasfasfnsdfgdsafasf";

functionmyfun（）{

varregex=/\b[A-Za-z]/g;

vararr=s.value.match（regex）;

varstr="";

for（vari=0;i

str=str+arr[i];

alert（str）;

5.设计一个网页，输入一串用英文逗号分隔的数字字符串。

编写程序，输出找出该组数中的最大、最小值、和。

并按从大到小排序后的输出结果（以逗号分隔）。

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

functionfun（）

{

varstr=document.getElementById（'in'）.value;

varreg=/\d+/g;

varnum=str.match（reg）;

varsum=0;

varmax1=parseInt（num[0]）;

varmin1=parseInt（num[0]）;

for（varj=0;j

sum=sum+parseInt（num[j]）;

if（parseInt（num[j]）

min1=num[j];

}

else{

max1=num[j];

}

for（vari=0;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;

}

6.要求用户在文本框中年份，点击判断按钮，用alert函数输出该年是否是闰年的结果。

DOCTYPEHTMLPUBLIC"-//W3C/HTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose>

charset=UTF-8">

functionleapyear（）{

varnow=newDate（）;

varyears=now.getFullYear（document.form1.

textfield.value）;

varstr;

varyears=document.form1.textfield.value;

varresult=（years%4==0&&years%100!

=0）||（years%400==0）?

years+"是闰年":

years+"不是闰年";

alert（result）;

}

7.利用复选框让用户选择其爱好，用alert对话框输出用户所选的内容。

篮球

足球

排球

乒乓球

8．要求在文本框中输入用户名，点击“注册”按钮进行提交。

当文本框为空时，则弹出提示信息，并取消提交操作。

姓名：

9.在打开网页后弹出一个宽200,高300的窗口,且在该网页关闭后，弹出的窗口也关闭。

DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http:

//www.w3.org/TR/html4/loose.dtd">

varwindow1;

functionload（）

{

window1=window.open（"","新窗口","height=200,width=300"）;

}

functionunload（）

{

window1.close（）;

}

10.直接利用Javascript操作DOM模型，将当前目录下的10张图片循环显示在网页上。

11.利用JQuery编写程序，将当前目录下的10张图片循环显示在网页上。

12.在状态栏上显示，访问者在本页停留的时间（如：

您在本页停留了X小时X分X秒）。

DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http:

//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

//www.w3.org/1999/xhtml">

varsecond=0;

varminute=0;

varhour=0;

functiontimeCount（）{

second=second+1;

setTimeout（"timeCount（）",1000）;

while（second>=60）{

minute=minute+1;

second=0;

while（minute>=60）{

hour=hour+1;

minute=0;

second=0;

}

}

window.status="你在本网页停留了"+hour+"小时"+minute+"分"+second+"秒";

}

三、实验要求

1．独立完成网页设计实习内容；

2.记录实验中出现的问题以及解决办法。

3．实习报告中要有对本次实验的总结。