JavaScript课堂练习(一)分析和总结.docx

JavaScript 课堂练习（一） 一.利用循环在网页中输出一表格,十行十列,单元格内依次写入 1-100: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 二.修改上面程序,在表格内的输出数据为:1-10,20-11,21-30. (之字型数 据序列)； 三.利用循环输出一个九九乘法表:(不使用表格,每一个算式使用一个 SPAN 标签) 四.修改上面的九九乘法表:结合 CSS 每隔一行使用一种不同的背景颜色五.结合 CSS 样式表,网页中生成表格:八行八列,黑白相间； 六.结合 CSS,编程在下面的 DIV 区域中生成如下图所示的图形: 答案（网页源代码） !DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN HTML HEAD TITLE New Document /TITLE META NAME=Generator CONTENT=EditPlus META NAME=Author CONTENT= META NAME=Keywords CONTENT= META NAME=Description CONTENT= style #t1 {background-color:lightyellow;border:1 solid red;width:300;text-align:center} span {background-color:orange;margin:1 3 0 3;padding:2 5 2 5;width:60} #t2 {border-collapse:collapse;border:1 solid black;} #t2 td{height:15;width:15} .hei {background-color:black;} /style /HEAD BODY P一.利用循环在网页中输出一表格,十行十列,单元格内依次写入 1-100:BR script document.write(table id=t1); for (var i=0;i10 ;i++ ) {document.write(tr); for (var j=0;j10 ;j++ ) {document.write(td,10*i+j+1,/td); } document.write(/tr) } document.write(/table); /script BR P二.修改上面程序,在表格内的输出数据为:1-10,20-11,21-30. (之字型数据序列)；BR script //在其内输入修改的程序 /script BR p三.利用循环输出一个九九乘法表:(不使用表格,每一个算式使用一个 SPAN 标签)BR script for (var i=1;i=9 ;i++ ) { for (j=1;j=i ;j++ ) {document.write(span,j,*,i,=,i*j,/span); } document.write(br); } /script BR P四.修改上面的九九乘法表:结合 CSS 每隔一行使用一种不同的背景颜色BR script //在其内输入修改的程序 /script BR P五.结合 CSS 样式表,网页中生成表格:八行八列,黑白相间； script var x,y; document.write(table id=t2); for(x=0;x8;x++) { document.write(tr); for(y=0;y8;y++) {if((x+y)%2==0) document.write(td class=hei/td); else document.write(td class=bai/td); } document.write(/tr); } document.write(/table); /script BR P六.结合 CSS,编程在下面的 DIV 区域中生成如下图所示的图形:BR IMG SRC=lin.gif ALT=照样图编程生成图形 DIV class=lin script /script /D