资源描述
习题
1. 什么是Web技术？
答：Web即全球广域网（World Wide Web），也称为万维网，它是一种基于超文本和HTTP的、全球性的、动态交互的、跨平台的分布式图形信息系统。它是建立在Internet上的一种网络服务，为浏览者在Internet上查找和浏览信息提供了图形化的、易于访问的直观界面，其中的文档及超链接将Internet上的信息节点组织成一个互为关联的网状结构。
2. 什么是Web前端？
答：Web前端是指基于Web（现在一般指动态页面技术）的客户端软件，也就是通常说的在浏览器端运行的网页程序。Web前端降低了应用软件部署的难度，减少了更新操作，只需对服务器一端的软件更新即可完成所有用户需要的更新，且现在的动态页面技术基本可以实现所有的传统C/S客户端的功能。
3. 什么是Web项目？Web项目包含哪些内容？Web前端开发技术有哪些？
答：（1）Web项目也可以称为Web工程或者Web应用程序。它是一种可以通过Web访问的应用程序。Web项目最大的一个好处就是用户很容易访问，用户只要安装了浏览器即可，不需要再安装其他软件。例如现在经常使用的门户网站（新浪、搜狐等）、电商网站（淘宝、京东等）、网上银行等都属于Web项目，用户通过浏览器就可以访问和使用它们。Web项目开发与建设是目前软件开发领域的三大方向之一。
（2）Web项目由两大部分组成，分别是Web客户端和Web服务器端。Web客户端的作用是组织和显示来自Web服务器端的信息，以及接收用户从界面上输入的信息并传递到Web服务器端；Web服务器端的作用是进行业务逻辑的处理和数据存储，并把处理后的结果反馈到Web客户端，供用户使用。
（3）基本的静态网页开发技术为HTML/CSS/JavaScript，图1-2所示为Web前端基础开发技术的基本情况。其中HTML的英文全称是Hyper Text Markup Language，中文全称是超文本标记语言，作用是在浏览器端组织和显示网页信息（文本、图片、视频等），属于网页的内容层。CSS英文全称是Cascading Style Sheets，中文全称是层叠样式表，作用是格式化网页的样式，如文本的字体、图片显示位置等，CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化，属于网页的样式层。JavaScript是客户端脚本语言，它使网页与用户之间产生动态交互效果，属于网页的行为层。
上机指导
1.使用Adobe Dreamweaver CC 2017创建一个HTML文档，文档名为inspur.html，网页中显示文本信息“浪潮优派欢迎你”。
答：源码请参见“CHO1_LAB\inspur.html”。
习题
1．用HTML标记语言编写一个简单的网页，网页最基本的结构是（ D ）。
A．<html> <head>…</head> <frame>…</frame> </html>
B．<html> <title>…</title> <body>…</body> </html>
C．<html> <title>…</title> <frame>…</frame> </html>
D．<html> <head>…</head> <body>…</body> </html>
2．创建最小的标题文本标签是（ D ）。
A．<pre></pre> B．<h1></h1> C．<h6></h6> D．<b></b>
3．HTML中，设置背景颜色的代码是（ A ）。
A．<body bgcolor=?> B．<body text=?> C．<body link=?> D．<body vlink=?>
4．在HTML中，下面是段落标签的是（ D ）。
A．<html>…</html> B．<head>…</head>
C．<body>…</body> D．<p>…</p>
5．HTML文件中的图片标记是（ B ）。
A．<a> B．<img> C．<link> D．<picture>
6．HTML文本显示状态代码中，<SUP></SUP>表示（ A ）。
A．文本加注下标线 B．文本加注上标线
C．文本闪烁 D．文本或图片居中
7．创建一个位于文档内部位置的链接的代码是（ D ）。
A．<a href="#NAME"></a> B．<a name="NAME"></a>
C．<a href="mailtEMAIL"></a> D．<a href="URL"></a>
8．HTML中，插入图像的HTML代码是<img src=" ">，其中src的含义是（ B ）。
A．链接的地址 B．图像的路径
C．所插入图像的属性 D．以上都正确
9．设置围绕一个图像的边框的大小的标记是（ D ）。
A．<img src="name" border=?></img> B．<img src="name" border=?>
C．<img src="name" height=?> D．<img src="name" bordersize=?>
10．设置水平线高度的HTML代码是（ B ）。
A．<hr> B．<hr size=?> C．<hr width=?> D．<hr noshade>
11．HTML代码<a name="NAME"></a>表示（ C ）。
A．创建一个超链接 B．创建一个自动发送电子邮件的链接
C．创建一个位于文档内部的链接点 D．创建一个指向位于文档内部的链接点
上机指导
1．使用Dreamweaver创建一个HTML文件，文件名为dangdangIndex.html，网页显示效果如图2-27所示。
图2-27 上机指导第1题网页显示效果
要求如下。
（1）“首页”“我的当当”“37类商品”三个按钮链接到本页即可。
（2）要求marquee属性从下到上，高度为100，鼠标移动至上边后停止，离开后继续移动。使用无序列表内容包括：
衬衫全场满百返30元A券
当当网图书短信比价服务
发表评论，月月礼券等你拿
雀巢矿泉水“开盖赢大礼”
当当有奖问答，69元抢购！
当当玩具让利狂潮抢购中
当当购物卡，送礼好选择
（3）网页中所有的图片信息，存在ch2\images目录中。
答：源码请参见“CH02_LAB\dangdangIndex.html”。
2．使用Dreamweaver创建一个HTML文件，文件名为workIndex.html，网页显示效果如图2-28所示。
图2-28 上机指导第2题网页显示效果
要求如下。
（1）单击“工作室简介”跳转到“工作室简介”位置。
（2）单击“设计作品”跳转到“设计作品”位置。
（3）单击“广告知识”跳转到“广告知识”位置。
（4）单击“E-mail站长”可以给自己的某一个qq邮箱发送邮件。
（5）“欢迎光临梦幻美术工作室！！”从右向左移动，并要求来回移动，当鼠标移动上去的时候停止，鼠标移开继续移动。
（6）广告知识下的链接都链接到本页即可。
（7）网页中所有的图片信息，存在目录ch2\images中。
答：源码请参见“CH02_LAB\workIndex.html”。
习题
1．框架中“不可改变大小”的语法是（ D ）。
A．<img src="url" border=?> B．<samp></samp>
C．<address></address> D．<frame noresize>
2．设置围绕表格的边框宽度的HTML代码是（ D ）。
A．<table size=#> B．<table border=#>
C．<table bordersize=#> D．<tableborder=#>
3．在HTML代码中，给表格添加行的标记是（ A ）。
A．<tr></tr> B．<td></td> C．<th></th> D．以上都正确
4．HTML代码<table width=# or%>表示（ B ）。
A．设置表格单元格之间空间的大小
B．设置表格单元格边框与其内部内容之间空间的大小
C．设置表格的宽度——用绝对像素值或文档总宽度的百分比
D．设置表格单元格的水平对齐
5．表格标记的基本结构是（ C ）。
A．<tr></tr> B．<br></br> C．<table></table> D．<bg></bg>
6．以下标记符中，用于设置表格标题的是（ B ）。
A．<title> B．<caption> C．<head> D．<html>
7．定义表格常用的3个标签是（ ABC ）。
A．<table> B．<tr> C．<td> D．<tp>
8．两个属性（ AD ）可用于表格的合并单元格。
A．colspan B．trspan C．tdspan D．rowspan
9．<frameset cols=#>用来指定（ B ）。
A．混合分框 B．纵向分框 C．横向分框 D．任意分框
10．HTML中“<noframes></noframes>”的具体含义是（ A ）。
A．无框架时的内容 B．相关性 C．基本视窗名称 D．文件形态
11．定义框架要用到（ C ）标签。
A．<framework> B．<frameset> C．<frame> D．<framespace>
12．定义上下分割的框架大小的是（ A ）。
A．rows B．cols C．widths D．heights
上机指导
1．使用Dreamweaver创建一个HTML文件，文件名为NBAIndex.html，网页显示效果如图3-15所示。
图3-15 上机指导第1题网页效果
要求如下。
（1）要求使用表格元素。
（2）表格中第一行的背景图片，存在ch3\images目录中。
答：源码请参见“CH03_LAB\NBAIndex.html”
2．使用Dreamweaver创建一个HTML文件，文件名为NBAIndex.html，网页显示效果如图3-16所示。
图3-16 上机指导第2题网页效果
要求如下。
（1）要求使用表格元素。
（2）表格中第一行的背景图片，存在ch3\images目录中。
答：源码请参见“CH03_LAB\NBAIndex.html”。
习题
1．下列关于表单的说法不正确的一项是（ B ）。
A．表单对象可以单独存在于网页表单之外
B．表单中包含各种表单对象，如文本域、列表框和按钮
C．表单就是表单对象
D．表单由两部分组成：一是描述表单的HTML源代码，二是用来处理用户表单域中输入的信息的服务器端应用程序客户端脚本
2．若要产生一个4行30列的多行文本域，以下方法中，正确的是（ C ）。
A．<input type="text" rows="4" cols="30" name="txtintrol">
B．<textarea rows="4" cols="30" name="txtintro">
C．<textarea rows="4" cols="30" name="txtintro"></textarea>
D．<textarea rows="30"cols="4" name="txtintro"></textarea>
3．HTML代码<select name="NAME"></select>表示（ D ）。
A．创建表格 B．创建一个滚动菜单
C．设置每个表单项的内容 D．创建一个下拉菜单
4．HTML代码<input type=text name="foo" size=20>表示（ B ）。
A．创建一个单选框 B．创建一个单行文本输入区域
C．创建一个提交按钮 D．创建一个使用图像的提交按钮
5．实现下拉列表框，要用到（B）标签。
A．<input> B．<select> C．<option> D．<radio>
上机指导
1．使用Dreamweaver创建一个HTML文件，文件名为clientMgrAdd.html，网页显示效果如图4-19所示。
图4-19 上机指导第1题网页效果
要求如下。
（1）要求使用表格进行布局。
（2）其中“民族”下拉框中的列表信息为：汉族、少数民族、其他。“政治面貌”下拉框中的列表信息为：中共党员、中共预备党员、共青团员、群众、其他。“学历”下拉框中的列表信息为：小学、初中、高中、中专、高职、专科、本科、硕士研究生、博士研究生。“专业技术职称”下拉框中的列表信息为：工程专业技术人员 高级工程师、工程专业技术人员 工程师、工程专业技术人员 助理工程师、经济专业技术人员 高级经济师、经济专业技术人员 经济师、经济专业技术人员 助理经济师、会计专业技术人员 高级会计师、会计专业技术人员 会计师、会计专业技术人员 助理会计师、统计专业技术人员 高级统计师、统计专业技术人员 统计师、统计专业技术人员 助理统计师、审计专业技术人员 高级审计师、审计专业技术人员 审计师、审计专业技术人员 助理审计师、政工专业技术人员 助理政工师、政工专业技术人员 高级政工师、政工专业技术人员 政工师。“客户经理等级”下拉框中的列表信息为高级专家级客户经理、专家级客户经理、资深客户经理、高级客户经理、客户经理、客户经理助理、无。“业务线条”下拉框中的列表信息为：对公、对个人。
（3）界面的样式信息可以等学完CSS后再进行完善。
答：源码请参见“CH04_LAB\clientMgrAdd.html”。
2．请使用Dreamweaver创建一个HTML文件，文件名为studyMgrAdd.html，网页显示效果如图4-20所示。
图4-20 上机指导第2题网页效果
要求如下。
（1）使用表格进行布局。
（2）其中“资料类型”下拉框中的列表信息为：规章制度、学习培训材料、岗位资格考试教程、客户营销技巧。
（3）界面的样式信息可以等学完CSS后再进行完善。
答：源码请参见“CH04_LAB\studyMgrAdd.html”。
习题
1．CSS的语法结构由三部分组成：选择器 、 属性 、 值 。
2．添加CSS的3种方法为 内联样式 、 内部样式 、外部样式 。
3．常用的字体属性有font-size、font-family、font-style、font-weight、font-variant。
4．CSS中的选择器不包括（ A ）。
A．超文本标记选择器 B．类选择器
C．标签选择器 D．ID选择器
5．若要在网页中插入样式表main.css，以下用法中，正确的是（ A ）。
A．<link href="main.css" type="text/css" rel="stylesheet">
B．<link src="main.css" type="text/css" rel="stylesheet">
C．<link href="main.css" type="text/css">
D．<include href="main.css" type="text/css" rel="stylesheet">
6．样式表定义#title {color:red}表示（ B ）。
A．网页中的标题是红色的
B．网页中某一个id为title的元素中的内容是红色的
C．网页中元素名为title的内容是红色的
D．以上任意一个都可以
7．CSS文本属性中，文本对齐属性的取值有（ BCDE ）。
A．auto B．justify C．center D．right E．left
上机指导
（1）对网页中“你好，欢迎使用CSS样式”文本内容应用字体属性，具体要求：字体为宋体，字体大小为36px，字体加粗。
答：源代码请参见“CH05_LAB \test01.html”。
（2）使用内联样式表，实现图5-34所示的页面效果。使用2个<p>标签包含相应的文本信息，要求设置如下样式：
① 第一段内容“内联样式表的应用”，宋体、字体大小为20px、字体颜色为蓝色、居中显示。
② 第二段内容“第一个样式表的使用……”，默认字体，字体大小为30px、加粗、居中显示。
答：源代码请参见“CH05_LAB \ test02.html”。
（3）设计一个网页，其页面展示效果如图5-35所示，具体要求如下：
①“冬至的由来”使用<h1>标题，字体颜色为蓝色。
② 使用<p>标签标记两段文字，左对齐显示，行间距为15px。
③ 正文中所有“冬至”的文字，显示为蓝色字体。
答：源代码请参见“CH05_LAB\test03.html”。
习题
1．网页布局的概念是把即将出现在网页中的所有元素进行 排版 。
2．盒模型由 外边距 、 内边距 、 内容 和 边框 组成。
3．盒子的定位方式有 静态定位、相对定位 、绝对定位和固定定位。
4．实现元素浮动的属性为float ，清除浮动可以使用 clear 属性。
5．CSS中盒子的padding属性包括的属性有（BCDE ）。
A．填充 B．上填充 C．底填充
D．左填充 E．右填充
6．CSS中，下面不属于盒子模型属性的是（A ）。
A．borderStyle B．margin C．padding D．border
7．下列CSS规则中能够让图层div不显示的选项是（ B ）。
A．div{display:block;} B．div{display:none;}
C．div{display:inline;} D．div{display:hidden;}
8．下列CSS规则中能让列表项水平排列的选项是（ A ）。
A．li{float:left;} B．li{float:none;}
C．li{float:middle;} D．li{float:up;}
9．简述采用DIV+CSS技术进行页面布局的基本步骤。
答：DIV+CSS布局的步骤大致有4步：第一步在整体上对页面进行分块；第二步使用<div>标签进行分块设计，清理<div>标签的嵌套以及层叠关系；第三步对<div>标签进行CSS定位；第四步在各个块中填充相应的内容。
上机指导
1.通过CSS+DIV实现鲜花网站的设计，具体要求如下。
（1）网站布局，由三个<div>组成，构建一行两列的网站页面。
（2）DIV1设置背景图片，使用table表格实现上方菜单导航。
（3）DIV2通过form表单+列表实现。
（4）DIV3实现图6-24所示的排列展示效果。
（5）背景图片位于image文件夹下。
答：源代码请参见“CH06_LAB \ test1\flowerShow.html”。
2．通过CSS+DIV实现个人主页（见图6-25）的设计具体要求如下。
（1）网站导航使用table（已用矩形框标示出来）完成，宽度为600px。
（2）网页布局：两列布局。
（3）背景图片位于image文件夹下。
答：源代码请参见“CH06_LAB\test2\personShow.html”。
习题
1.CSS3遵循了___模块化___开发模式。
2.在CSS3中增加的设置元素不透明度的属性的是_opacity__。
3.CSS3中新增加的选择器分别是__关系选择器__、__属性选择器_和__伪类选择器___。
4.CSS3中设置边框圆角的属性是__border-radius__，设置文本阴影的属性是_text-shadow__。
5.CSS3中新增加的颜色模式有__RGBA__、___HSL___和__HSLA___。
6.在CSS3中，为某元素设置border-radius：20px 25px的圆角样式，其中20px作用在该元素的___上左边角__、__下右边角___，25px作用在该元素的___下左边角___、___上右边角___。
7.CSS3中，新增加的UI元素状态伪类选择器有__checked选择器___、___enabled选择器___和____disabled选择器______。
8.在CSS3中，text-overflow属性的取值可以为__clip__和__ ellipsis _____。
9.RGBA色彩模式的语法为rgba(r,g,b,a),其中a代表_透明度___，取值为__0~1__。
上机指导
1.使用CSS3制作如图所示导航菜单
图7-24 CSS3制作导航菜单实现效果一
要求：1导航条设置圆角效果
2 导航菜单选项之间设置分隔线（第一个选项前不设置，最后一个选项后不设置）
3 当鼠标悬停到任意的菜单选项时，该菜单选项右下方出现紫色阴影效果，当鼠标移 开后，阴影效果消失，如图所示
图7-25 CSS3制作导航菜单实现效果二
答：源代码请参见“CH07_LAB\navigation.html”。
2.为下面代码添加CSS样式，实现如图所示效果。
<body>
<div class="yue">
</div>
<div class="text">
<span>中</span>
<span>秋</span>
<span>佳</span>
<span>节</span>
</div>
</body>
图7-26 “中秋佳节”网页实现效果
要求:
1.class=”yue”的div元素，宽度为300px,高度为300px,背景为素材bg7-7.jpg，设置圆角实现月亮效果。
2.使用伪类选择器分别设置“中”、“秋”“佳”、“节”字体的位置以及阴影效果。
答：源代码请参见“CH07_LAB\goddess.html”。
习题
一、选择题
1.以下代码运行后的结果是输出( B )
var a=[1, 2, 3];
console.log(a.join());
A．123 B．1,2,3 C．1 2 3 D．[1,2,3]
2.在 JavaScript中，'1555’+3 的运行结果是( C )
A．1558 B．1552 C．15553 D．1553
3.以下代码运行后弹出的结果是( B )
var a = 888;
++a;
alert(a++);
A．888 B．889 C．890 D．891
4.关于变量的命名规则，下列说法正确的是（ ABCDE ）
A．首字符必须是大写或小写的字母、下划线（_）或美元符（$）
B．除首字母的字符可以是字母、数字、下划线或美元符
C．变量名称不能是保留字
D．长度是任意的
E．区分大小写
5.下列哪一个表达式返回值为假（ B ）
A．!(3<=1)
B．(4>=4)&&(5<=2)
C．(“a”==“a”)&&(“c”!=“d”)
D．(2<3)||(3<2)
二 填空题
1.Boolean类型的值有true 和false。
2.在HTML文件中引入JavaScript的两种方式是直接把js代码写在html页面中和在页面中进行引入js文件。
3．下面代码执行完成后，k的结果是 10
var i = 0,j = 0;
for(;i<10,j<6;i++,j++){
k = i + j;
}
上机指导
1. 请编写程序，在网页上打印输出杨辉三角形
答：源代码请参见“CH08_LAB\yanghui.html”。
2.编写一个函数，在页面上输出1~1000之间所有能同时被3、5、7整除的整数，并要求每行显示6个这样的数。
答：源代码请参见“CH08_LAB\number.html”。
习题
1. 要求用JavaScript实现下面的功能：在一个文本框中内容发生改变后，单击页面的其他部分将弹出一个消息框显示文本框中的内容，下面语句正确的是( A )。
A.<input type="text" onChange="alert(this.value)">
B.<input type="text" onClick="alert(this.value)">
C.<input type="text" onChange="alert(text.value)">
D.<input type="text" onClick="alert(value)">
2. 下列选项中，( D )不是网页中的事件。
A.onclick
B.onmouseover
C.onsubmit
D.onpressbutton
3. 在HTML页面中，不能与onChange事件处理程序相关联的表单元素有( D )。
A.文本框
B.复选框
C.列表框
D.按钮
4. 以下关于JavaScript事件的描述中，不正确的是：（D）
A.click——鼠标单击事件
B.focus——获取焦点事件
C.mouseOver——鼠标指针移动到事件源对象上时触发的事件
D.change——选择字段时触发的事件
5. 考察以下代码片段：
＜script type="text/JavaScript"＞
function handleEvent() {
var oTextbox =document.getElementById("txt1");
oTextbox.value += " " + event.type;//event是所触发的事件对象
}
＜/script＞ 请在文本框中操作键盘：
＜input type="text" id="txt"size="5"
onkeydown="handleEvent()"
onkeyup="handleEvent()"
onkeypress="handleEvent()"/＞
＜textarea id="txt1" rows="6" cols="30"＞＜/textarea＞
如果光标定位文本框中，敲击键盘的shift键，文本域中的输出结果为:（B ）
A.keydown keyup keypress
B.keydown keyup
C.keydown
D.keyup
6. 分析下面的代码：
<HTML>
<BODY>
<SELECT type="select" name="s1" onChange=alert("你选择了"+s1.value) >
<OPTION selected value=select1 >北京< /OPTION>
<OPTION value=select2 >上海</OPTION >
<OPTION value=select3 >广州</OPTION >
</SELECT>
</BODY >
</HTML>
下面对结果的描述正确的是：（ A ）。
A.当选中“上海”时，弹出“你选择了select2”信息框
B.当选中“广州”时，弹出“你选择了广州”信息框
C.任何时候选中“北京”时，不弹出信息框
D.代码有错误，应该将“onChange”修改为“onClick”
7. 下列哪个不是js的事件类型（A）
A.动作事件
B.鼠标事件
C.键盘事件
D.HTML页面事件
8. 下列关于鼠标事件描述有误的是（B）
A.click表示鼠标单击
B.dblclick表示鼠标右击
C.mousedown表示鼠标的按钮被按下
D.mousemover表示鼠标进入某个对象范围，并且移动
9. 考察以下代码片段：
＜form action="#" name="form1"＞
＜input type="button" name="button1" value="按钮1"/＞
＜input type="button" name="button2" value="按钮2"/＞
＜/form＞
＜script type="text/javascript"＞
function handleEvent1(){
document.form1.button2.click();
}
function handleEvent2() {
alert(event.srcElement.name+"的"+event.type+"事件被触发！");
}
document.form1.button1.onclick = handleEvent1;
document.form1.button2.onclick =handleEvent2;
＜/script＞
如果用户点击了按钮1，此时输出结果为：A
A.输出 “button2的click事件被触发！”
B.输出 “button1的click事件被触发！”
C.程序出错，没有输出
D.依次输出“button1的click事件被触发！” “button2的click事件被触发！”
10. 下列陈述有误的是（D）
陈述一：一个button的click事件只能添加一个事件处理函数
陈述二：js事件一旦添加就无法销毁
A.陈述1正确，陈述2错误
B.陈述1错误，陈述2正确
C.两种陈述都正确
D.两种陈述都错误
上机指导
1. 请使用Dreamweaver创建一个HTML文件，文件名为eventExercise.html，网页显示效果如图9-6所示
图9-6 上机指导第1题网页效果图
要求：
1、 点击“显示”按钮后，在下边显示已选择的水果
2、 要求分别用三种事件注册方式进行实现，体会三种事件注册方式的区别
答：源代码请参见“CH09_LAB\fruits.html”，
CH09_LAB\fruits2.html，
CH09_LAB\fruits3.html。
习题
一、选择题
1、 以下说法不正确的是：（B）
A.DOM 的全称为 Document Object Model
B.BOM 为文档对象模型
C.DOM 的作用为可以对页面的内容进行增加删除替换
D.BOM 为浏览器对象模型
2、下列关于获取页面元素说法正确的是：（AC）
A.document.getElementById(‘a’)是通过 id 值a获取页面中的一个元素
B.document.getElementsByName(“na”)是通过name属性值na获取页面中的一个元素
C.document.getElementsByTagName(“div”)是通过标签名获取所有 div
D.以上说法都不正确
二 填空题
1、请写出至少3个BOM中常用的对象 screen 、history、 location。
2、我们通过 location 对象获取当前页面地址的信息。
3、DOM 中获取第一个子节点 firstChild ，所有子节点 lastChild 。
上机指导
1、 假设有如下HTML页面：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<p>欢迎您!</p>
</body>
</html>
（1）使用DOM来添加下列代码到上面这个页面中：<p>Hello World!</p>
（2）把上面<p>Hello World!</p>内容替换成<p>Hello China！</p>
（3）在上一题的基础上添加内容<p>Hello Inspur！</p>
答：源代码请参见“CH10_LAB\ hello.html”。
2 编写一个HTML页面，要求如下：该页面包含两个按钮：“绘制乘法表”和“删除一行”，页面效果如图10-11所示。
（1）点击“绘制乘法表”询问用户需要生成的行数，根据用户输入决定打印内容。
（2）点击“删除一行”，能够删除乘法表最后一行的内容。
图10-11乘法表
答：源代码请参见“CH10_LAB\multi.html”。
习题
1．HTML代码实现过程中，设置<a>标签点击弹出新窗口或者新标签页，可以设置属性 target="_blank" 或者 target="view_window" 两种方式。
2．HTML 4.01与HTML5之间在设置HTML文档的字符编码方面的差异是前者通常使用 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> ，后者使用 <meta charset="utf-8" /> 。
3．HTML文档中如果要去除载入图片失败时显示在左上角的碎片图标，要借用<img>标签的 onerror 事件和JavaScript。
4．HTML文档中设置登录或者注册页面时，表单提交需要设置method使用 post 方式。
上机指导
1. 说一下Java语言的特点及相对于其他编程语言的优点？本章介绍的商城首页幻灯片广告，具体实现时还有各种不同的切换效果，请查找资料实现其他切换效果，例如百叶窗、放射、飞入等。
答：源代码请参见“CH11_LAB\key1\index.html”。
2. 本章介绍的购物车页面，当前商品数量修改方式为双击编辑，请尝试添加修改商品数量的加减号按钮，以实现单击加减号修改商品数量。
答：源代码请参见“CH11_LAB\key2\index.html”。
展开阅读全文
浙ICP备2021020529号-1 | 浙B2-20240490 
