Web前端开发技术期末测试及解析一

最新推荐文章于 2024-06-17 10:51:24 发布
最新推荐文章于 2024-06-17 10:51:24 发布
阅读量1.3w 收藏 347
点赞数 56
分类专栏： 前端开发学习笔记 文章标签： HTML CSS JavaScript 样式设置 事件处理
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qiaoxinwei/article/details/121899752
版权

一、选择题（每题 1 分，共 20 分）

  1. HTML 指的是（ ）。
    （A）超链接的文本标记语言 （B）超文本标识语言
    （C）家庭工具标记语言 （D）以上都不是

【答案】B

  1. 下列能够实现美化页面的语言是（ ）。
    （A）HTML （B）CSS
    （C）VFP （D）JavaScript

【答案】B

  1. 以下标记中用于设置内部样式表的标记的是（ ）。
    （A）<style> （B）<title>
    （C）<script> （D）<head>

【答案】A

  1. 要在段落的首行空两个汉字，要插入（ ）个空格&nbsp;。
    （A）1 （B）3
    （C）2 （D）4

【答案】D
【解析】一个&nbsp是一个字符，一个汉字是两个字符，所以两个字的空格应该是4个&nbsp。

  1. 在方程的解 X 1 = 2 X_1=2 X1​=2 中下标“1”在 HTML 中可以使用（ ）标记实现。
    （A）<b> （B）<tt>
    （C）<sub> （D）<sup>

【答案】C

  1. 定义列表的 HTML 代码是（ ）。
    （A）<dt><dl>...<dd>...</dl> （B）<dd><dt>...<dl>...</dd>
    （C）<dt><dd>...<dl>...<t> （D）<dl><dt>...<dd>...</dl>

【答案】D

  1. 将超链接的目标网页在上一级的窗口中打开的方式是（ ） 。
    （A）_parent （B）_self
    （C）_top （D）_blank

【答案】A

  1. 设置表格边框颜色的 HTML 代码是 （ ） 。
    （A）<table color=""> （B）<th bordercolor="">
    （C）<table bordercolor=""> （D）<th color="">

【答案】C

  1. 关于 HTML 表格说法错误的是（）。
    （A） 表格的 width 属性可以设置为像素或百分比
    （B） 表格的 height 属性可以设置为像素或百分比
    （C） 如果不指定 border 属性，表格默认宽度为 1
    （D） 表格和单元格的背景色可以同时指定

【答案】C
【解析】如果不指定 border 属性，表格默认没有边框。

  1. 嵌入多媒体文件的 HTML 的代码正确的是（ ）。
    （A）<embed url=""></embed> （B）<embed src=""></embed>
    （C）<a src="">…</embed> （D）<a url=""> …</embed>

【答案】B

  1. 在表单中插入列表框的正确的 HTML 代码是（ ）。
    （A） <input type="submit" ></input>
    （B） <textsrea name="textarea"></textarea>
    （C） <select multiple></select>
    （D） <input type=select ></input>

【答案】C

  1. 下列能够设置文本加粗的 CSS 属性值对是（ ）。
    （A）font-weight:bold （B）style:bold
    （C）font:b （D）font="粗体"

【答案】A

  1. 去掉文本超链接的下划线的方法是（ ）。
    （A） a{text-decoration:no underline;}
    （B） a{underline:none;}
    （C） a{decoration:no underline;}
    （D） a{text-decoration:none;}

【答案】D

  1. 解释执行 JavaScript 的是（ ）。
    （A） 服务器 （B）编辑器
    （C） 浏览器 （D）编译器

【答案】C

  1. 下列赋值语句格式错误的是（ ）。
    （A） var nValue=35.00;
    （B） var nValue=nValue+35.00;
    （C） var nValue=someFunction()+35.00; //someFunction()已经定义
    （D） var firstName=lastName=middleName="";

【答案】B

  1. 下列 CSS 的规则正确的是（ ）。
    （A）body{color:black;}（B） {body;color:black}
    （C）body:color=black （D） {body:color=black(body)}

【答案】A

  1. 图层引用已定义的类选择符正确的 HTML 代码是： 。
    （A）<div idname=""; ></div> （B）<div class=""; ></div>
    （C）<div classname=""; ></div> （D）<div name=""; ></div>

【答案】B

  1. 下列属于<option>标记的属性是：（ ）。
    （A）value （B）size
    （C）checked （D）rows

【答案】A

  1. 下列运算符中表示逻辑或的运算符是（ ）。
    （A）&& （B）||
    （C）! （D）++

【答案】B

  1. 下列属于鼠标指针悬停在对象上发生的事件是（ ）。
    （A）onMouseOut （B）onMouseOver
    （C）onSelect （D）onClick

【答案】B

二、填空题（每题 0.5 分，共 10 分）

  1. HTML 文件的扩展名可以是 ____________或 ____________。

【答案】html,htm

  1. 在 HTML 文件里，文本格式化标记中 ____________ 标记可用来设置删除效果。

【答案】<del>

  1. 一个完整的 HTML 文件包含 ____________ 和 ____________ 等两部分（填标记名称）。

【答案】<head>,<body>

  1. 在<a>标记中定义窗口弹出方式的属性是 ____________。

【答案】target

  1. 设置背景音乐除了使用<bgsound>标记外还可以使用 ____________ 标记来播放背景音乐。

【答案】<embed>

  1. 表格的 ____________ 属性指定了单元格中内容与单元格边框之间的空间大小。

【答案】cellpadding

  1. 一个有三个框架的 Web 页，实现上独立的 HTML 文件有 ____________ 个。

【答案】4

  1. 标识符可以 ____________ 或 ____________开始，由字母、数字和下划线组成，不能出现空格或制表符。

【答案】字母、下划线

  1. 在表单中让用户从互斥的选项中只能选一项，可使用 type 为“ ____________”的输入框。

【答案】radio

  1. 控制框架集窗口周围是否出现边框线的属性是 ____________ 。

【答案】frameborder

  1. CSS 中有 4 种定义颜色的方法分别是 ____________、____________、____________和 RGB（百分比）。

【答案】英文颜色名称、#十六进制数、rgb(十进制数)

  1. 导入样式表必须放在内部样式表里的是第____________行，否则导入样式无效。

【答案】1

  1. 如果 var x=5,y="5";则x===y的结果是____________。

【答案】false

  1. 在 JavaScript 脚本中自增运算 i++等同于____________语句。

【答案】i=i+1

  1. 在<select>中利用____________属性可以定义下拉列表框的大小为 5。

【答案】size

三、看图编程（每空 2 分，共 42 分）

  1. 按下图所示效果，参照注释提示信息，完成代码填充。
    在这里插入图片描述
<html>
   <head>
   	<title> 有序列表 </title>
   </head>
   <body>
   		<!— 填充说明：
   			（1）直接使用标记使“新开课程”标题加粗；
   			（2）指定列表项编号为大写字母；
   			（3）从第三个开始编号；
   			（4）指定列表项编号为数字；
   			（5）从 7 开始编号
   		 -->
   	 （1）	
   		<ol   （2）		 （3）	>
   			<li>大学英语</li>
   			<li>高等数学</li>
   			<li   （4）	 （5）	>计算机科学导论</li>
   			<li>Web 前端开发技术</li>
   			<li>大学物理</li>
   		</ol>
   </body>
</html>

【答案】
（1）<b>新开课程</b> 或者 <strong>新开课程</strong>
（2）type="A"
（3）start="3"
（4）type="1"
（5）value="7"

  1. 按下图所示效果，参照注释提示信息，完成代码填充。
    在这里插入图片描述
<html>
	<head>
		<title>设定跨行的表格</title>
	</head>
	<body>
		<!—填充说明：
		（6）设置边框宽度为1；
		（7）设置单元格跨行；
		（8）设置单元格垂直居中对齐；
		（9）设置单元格跨列；
		（10）设置单元格水平居中对齐；-->
		<table width="600" （6） cellpadding="0" cellspacing="0" align="center">
			<caption>课程表</caption>
			<tr>
				<th>节次</th><th>星期一</th><th>星期二</th>
				<th>星期三</th><th>星期四</th> <th>星期五</th>
			<tr>
			<tr>
				<td>第 1 节</td><td>体育</td><td>大学英语</td><td>高等数学</td>
				<td  （7） （8）>数据结构</td>
				<td>Web 开发</td>
			</tr>
			<tr>
				<td>第 3 节</td><td>大学英语</td> <td>高等数学</td>
				<td>数据结构</td> <td>Web 开发实验</td>
			</tr>
			<tr>
				<td （9）（10）>适用时间：2008-2009 第一学期 083007 班</td>
			</tr>
		</table>
	</body>
</html>

【答案】
（6）border="1"
（7）rowspan="2"
（8）valign="middle"
（9）colspan="6"
（10）align="center"

  1. 按下图所示效果，参照注释提示信息，完成代码填充。
    在这里插入图片描述
<html>
	<head>
		<title> 样式表-排版 </title>
		<style type="text/css">
		.p3{text-transform:capitalize;}
		/*类选择 p4 定义说明：
		(11)段首空 2 个字符；
		(12)设置行高为 35px；
		(13)设置背景色为#000033；
		(14)设置文字居中对齐(15)设置字符间距为 2px;(16)引用样式 p4  */
		.p4{ 
			（ 11）; 	
			（ 12）; 
			（ 13）;
			（14）;
			（15）;
			color:#ffffff;
		}
		</style>
	</head>
	<body>
		<p  （16）   >核心提示：3 月 30 日，京东商城推出火车票预订和代购业务。目前提供火车票代购业务的商业网站还有去哪儿网、携程、铁友旅行网（以下简称铁友网）等。铁道部称，12306 网站是销售火车票的唯一专业网站，铁路部门没有授权或委托任何其他网站开展火车票发售或代购业务。
		<span class="p3">commissioner, independent commission</span></p>
	</body>
</html>

【答案】
（11）text-indent:2em
（12）line-height:35px
（13）background-color: #000033
（14）text-align:center
（15）letter-spacing:2px
（16）class="p4"

  1. 按下图所示效果，参照注释提示信息，完成代码填充。  
    在这里插入图片描述
<html>
	<head>
		<title> 改变网页页面字的大小 </title>
		<style type="text/css"> 
			#content{
				/*填充说明 
				（17）设置边框宽度 2px、线型 groove、颜色#0000cc */
				font-size:12px;
				line-height:200%;
				padding:10px;
				background:#000099;	
				color:white;
				（17）;}
			p{text-indent:2em;}
		</style>
		<!—填充说明：
		（18）设置 type 属性值；
		（19）通过 ID 获取元素方法；
		（20）超链接的关键属性；
		（21）设置超链接单事件句柄 -->
		<script type="  （18）	">
			function setfont(size){
				var obj=  （19）("content"); 
				obj.style.fontSize=size; 
				obj.style.color="#ff0000";
			}		 
		</script>
	</head>
	<body>
		<h2	align="center">用 JavaScript 代码改变网页字体大小</h2>
		<div>设定字体大小: 
			<a 	（ 20）	="javascript:setfont('12px')">小</a>
			<a href="#"  （21）="javascript:setfont('18px');">中</a>
			<a href="javascript:setfont('24px');">大</a></div>
		<div id="content">
		<p>JavaScript 是一种能让你的网页更加生动活泼的程式语言，也是目前网页中设计中最容易学又最方便的语言。</p> </div>
	</body>
</htmL>

【答案】
（17） border:2px groove #0000cc
（18）text/javascript
（19）document.getElementById
（20）href 
（21）onclick

四、问答题（12 分）

  1. 写出无序列表结构语法，无序列表的列表项符号通过什么属性去更改？有几种不同的取值（ 英文表示）？(6 分)

【答案】
（1）无序列表结构（2分）；

<ul type= “disc”> <li>…</li> <li>…</li> </ul>  

（2）无序列表的列表项符号通过type属性去更改 （1分）；
（3）有三种不同的取值分别：disc(实心点)、circle(空心圆)、square(黑方块) （3分）

  1. 通过 DOM 访问网页元素的方法有几种？分别是什么？(6 分)

【答案】
（1）DOM访问网页元素的方法有三种：

  • 通过ID，document.getElementById(“元素Id”)（2分）；
  • 通过Name，获取同类名称的数组，document.getElementsByName(“元素名称”)（2分）； 
    通过TagName，获取同类标记的数组，document.getElementsByTagName(“标记名称”)（2分）。

少儿编程乔老师
关注
  • 56
    点赞
  • 踩
  • 347
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
2023年某科技公司前端开发初级岗的面试笔试真题（含选择题答案、问答题解析、机试题源码）
黛琳ghz的博客，期待你的关注。
04-28 3961
这篇文章分享的真题是来自2023年某科技公司的笔试真题，面试的岗位是初级前端，题目内容包括了选择题、问答题、机试题，当然与面试官交谈的过程也是必不可少的一部分，主要还是针对简历的项目经验、工作经历来展开提问和交流，这里就不过多描述了。
滁州学院《Web前端开发技术》期末上机试题（A卷）（B卷）计算机与信息工程学院 Web.rar
01-09
滁州学院《Web前端开发技术》期末上机试题（A卷）（B卷）计算机与信息工程学院 适用专业： 2017物联网工程1，2班 一、制作HTML5格式的网页，内容为《元日》诗歌内容。22分 元日 宋代：王安石 爆竹声中一岁除，春风送暖入屠苏。 千门万户曈曈日，总把新桃换旧符。
Web前端第一阶段基础考试试卷HTML+CSS
qq_54075517的博客
07-20 1176
Web前端第一阶段基础考试试卷HTML+CSS
web前端期末大作业——HTML+CSS简单的旅游网页设计与实现
最新发布
网页设计与制作
06-17 710
👨‍🎓静态网站的编写主要是用 HTML DⅣV+ CSSJS等来完成页面的排版设计👩‍🎓，一般的网页作业需要融入以下知识点：div布局、浮动定位、高级css、表格、表单及验证、js轮播图、音频视频Fash的应用、uli、下拉导航栏、鼠标划过效果等知识点，学生网页作业源码，制作水平和原创度都适合学习或交作业用，记得点赞。 🏀 精彩专栏推荐👇🏻👇🏻👇🏻 💝 【作者主页——🔥获取更多优质源码】 💝 【web前端期末大作业——🔥🔥毕设项目精品实战案例(1000套)】🚀 旅游景
WEB前端面试选择题解答（共36题）.pdf
08-22
此文档讲解了WEB前端经典的36道选择题，文档中会有详细的描述与讲解，对于自我能力的进阶和前端知识的巩固，都有很重大的意义和价值。
table表格单元格的宽度计算规则
weixin_42178670的博客
07-12 3028
表格的计算方式包括两种：固定表格布局和自动表格布局 如果设置了border-collapse:separate; 需提前设置 table { border-spacing: 0; }，不设置的话会出现tr比table小4px（默认border-spacing: 2px;），如果设置border-collapse: collapse;则不需要设置border-spacing 为了更好的对比，先量出样本内容宽度为117.73px（下面会用到这一串文字作为填充内容） 如果table和td均设置了border之后
HTML之表格
DoubleC的博客
04-16 1540
在文档处理中,表格是一种很常用的表现手法。在HTML中的表格除了用来对齐数据之外,更多地用来进行页面排版。无论是普通的HTML页面还是动态网站都需要使用表格来进行页面的布局。 创建表格 表格的开始元素<TABLE>,结束元素是</TABLE>。所有的表格内容都位于这两个元素之间。要创建一个完整的表格,除了包含表格元素外,还要有行元素<TR>和单元格元素...
80道前端面试经典选择题
qq_40588413的博客
02-08 1万+
前言 看了一下各种面试题，选择题是必有的 所以我整理了一些经典的前端面试选择题，希望能对大家日后找工作有所帮助！ HTML/CSS 1、在 css 选择器当中，优先级排序正确的是（） A、id选择器>标签选择器>类选择器 B、标签选择器>类选择器>id选择器 C、类选择器>标签选择器>id选择器 D、id选择器>类选择器>标签选择器 解析： 选D...
那些web前端经典面试题大全及答案
weixin_33743703的博客
01-16 1万+
阅读目录JavaScript部分JQurey部分HTML/CSS部分正则表达式开发及性能优化部分本篇收录了一些面试中经常会遇到的经典面试题以及自己面试过程中遇到的一些问题，并且都给出了我在网上收集的答案。马上就要过春节了，开年就是崭新的一年，相信很多的前端开发者会有一些跳槽的悸动，通过对本篇知识的整理以及经验的总结，希望能帮到更多的前端面试者。（如有错误或更好的答案，欢迎指正，水平有限，望各位不吝...
前端开发测试题（一）
weixin_34179968的博客
05-15 543
一选择题（共25分，每题5分）1.CSS样式的几种链接方式，哪种优先级最高？A．@import样式导入 B. <style>页面内联C．<link>页面外链 D. style结构内嵌 2.使用Javascript在数组尾部添加数据的方法是？A．arra...
分享 100 道基础的前端面试题（附答案）
前端达人
04-13 3万+
最近在整理 JavaScript 的时候发现遇到了很多面试中常见的面试题，本部分主要是作者在 Github 等各大论坛收录的 JavaScript 相关知识和一些相关面试题时所做的笔记，分享这份总结给大家，对大家对 JavaScript 的可以来一次全方位的检漏和排查，感谢 CavsZhouyou 的付出，原文链接放在文章最下方，如果出现错误，希望大家共同指出！附笔记链接...
前端面试题目搜集——理论知识篇
weixin_30553837的博客
12-23 1444
一、理论知识 1.1、讲讲输入完网址按下回车，到看到网页这个过程中发生了什么 a. 域名解析 b. 发起TCP的3次握手 c. 建立TCP连接后发起http请求 d. 服务器端响应http请求，浏览器得到html代码 e. 浏览器解析html代码，并请求html代码中的资源 f. 浏览器对页面进行渲染呈现给用户 参考《一次完整的HTTP事务是怎样一个过程》 1.2、谈谈你对...
分享63个最常见的前端面试题及其答案
前端达人
07-26 1万+
在前端面试中，各种面试题都会遇到，因此，今天我们整理了60+比较常见繁杂的面试题，希望这些面试题能够对你有所帮助。当然，这些面试题的答案都不是标准答案，只是对答案做了一个简介明了的说明，希望可以快速帮助你梳理重点核心内容。这些答案可以作为参考，但是不能作为唯一标准答案，你也可以在面试时，自行补充。如果有不对的地方，欢迎指出，我们一起交流学习进步。现在，让我们以简洁明了的方式探讨这些问题的解决方案：...
web前端期末大作业实例 (1500套) 集合
网页设计与制作
12-16 1103
📔网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。📓网站程序方面：计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器，已达到打开后就能即时看到网站的效果。📘网站素材方面：计划收集各大平台好看的图片素材，并精挑细选适合网页风格的图片，然后使用PS做出适合网页尺寸的图片。📒网站文件方面：网站系统文件种类包含：html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件；
前端经典面试题（有答案）
m0_64460287的博客
03-07 1217
var a = 10var obj = { a: 20, say: () => { console.log(this.a) }}obj.say() var anotherObj = { a: 30 } obj.say.apply(anotherObj) 输出结果：10 10我么知道，箭头函数时不绑定this的，它的this来自原其父级所处的上下文，所以首先会打印全局中的 a 的值10。后面虽然让say方法指向了另外一个对象，但是仍不能改变箭头函数的特性，它的this仍然是指向全局的，所以依旧会输
HTML+CSS+JS面试题
AlexWang
11-13 3万+
HTML+CSS+JS面试题 一、单项选择(165题) 1.HTML是什么意思？ A)高级文本语言 B)超文本标记语言 C)扩展标记语言 D)图形化标记语言 2.浏览器针对于HTML文档起到了什么作用？ A)浏览器用于创建HTML文档 B)浏览器用于查看HTML文档 C)浏览器用于修改HTML文档 D)浏览器用于删除HTML文档 3.默认情况下，使用P标记会形成什么效果
1+X WEB前端中级 选择题-单选汇总1
热门推荐
niuroufen5的博客
11-18 4万+
JavaScript中下面选项关于this描述正确的是() A. 在使用new实例化对象时, this指向这个实例对象 B. 当对象调用函数或者方法时,this指向这个对象。 C. 严格模式下,this指向window D. 在任何情况下this指向一旦确定就不能修改 mysql_connect()与@mysql_connect()的区别是: A. @mysql_connect()不会忽略错误,将错误显示到客户端 B. mysql_connect()不会忽略错误,将错误显示到客户端 C. 有.
html使标签为正方形,W3C CSS测试答案
weixin_32899267的博客
05-31 158
您的回答：1.CSS 指的是？您的回答：Cascading Style Sheets2.在以下的 HTML 中，哪个是正确引用外部样式表的方法？您的回答：3.在 HTML 文档中，引用外部样式表的正确位置是？您的回答： 部分4.哪个 HTML 标签用于定义内部样式表？您的回答：5.哪个 HTML 属性可用来定义内联样式？您的回答：style6.下列哪个选项的 CSS 语法是正确的？您的回答：bod...
Web前端期末复习
qq_73895400的博客
12-04 434
超链接（Hyper Link）是指从一个网页指向另一个目标的连接关系，这个目标可以是另一个网页，也可以是相同网页上的不同位置，还可以是一个图片、一个电子邮件地址、一个文件，甚至是一个应用程序。HTML5文件是由一系列成对出现的元素标签嵌套组合而成，这些标签以<元素名>的形式出现，用于标记文本内容的含义。<meta>标签用于提供当前HTML文档的元数据，这些数据不会直接显示在网页上，但是对于机器是可读的，适用于搜索引擎索引。当HTML5文档中使用了相对路径时，浏览器会用<base>标签指定的URL进行补全。
web前端开发技术期末考试中，有哪些易错知识点？
06-09
在web前端开发技术期末考试中，以下是一些易错的知识点： 1. 盒子模型：需要清楚理解盒子模型的概念、属性和计算方法。 2. 浮动和定位：需要掌握浮动和定位的基本概念、属性和应用，以及它们之间的关系。 3. CSS选择器和优先级：需要理解不同类型的CSS选择器，以及CSS优先级的计算方法和规则。 4. 响应式布局：需要理解响应式布局的概念和原理，以及如何使用CSS媒体查询和弹性盒子模型来实现响应式布局。 5. CSS动画和过渡：需要掌握CSS动画和过渡的基本概念和属性，以及如何使用它们来实现动画效果。 6. JavaScript基础知识：需要掌握JavaScript的基本语法、数据类型、运算符、流程控制语句和函数等知识点。 7. DOM操作：需要理解DOM的基本概念、属性和方法，以及如何使用JavaScript来操作DOM。 8. Ajax技术：需要理解Ajax的原理和应用，以及如何使用XMLHttpRequest对象和jQuery库来实现Ajax。 9. 浏览器兼容性：需要了解不同浏览器之间的差异和兼容性问题，以及如何使用CSS Hack、JavaScript Polyfill和Modernizr等工具来解决兼容性问题。 10. 性能优化：需要了解如何使用浏览器开发者工具来分析网页性能，以及如何使用优化技巧和工具来提高网页性能。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

少儿编程乔老师

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值