HTML专项练习（1）

1.哪个元素显示任务的完成进度？

A <progress>

B <option>

C <select>

D <meter>

正确答案：A

解析：progress 元素中显示指示任务完成进度的指示器，该指示器通常显示为进度栏。它还包括所有的全局属性，包括 max、value 等。

2.哪个HTML5代码提供了一种验证数字输入的值在1到100之间?

A <input type="number" low="1" high="100">

B <input type="number" min="1" max="100">

C <input type="num" min="1" max="100">

D <input type="positive" limit="100">

正确答案：B

解析：min 属性规定输入字段所允许的最小值

max 属性规定输入字段所允许的最大值

min 属性与 max 属性配合使用，可创建合法值范围

max 和 min 属性适用于以下 <input> 类型：number, range, date, datetime, datetime-local, month, time 以及 week

3.sessionStorage 保存数据的方法正确的是：

A sessionStorage.setItem(“键值”,”键名”);

B sessionStorage.saveItem(“键名”,”键值”);

C sessionStorage.saveItem(“键值”,”键名”);

D sessionStorage.setItem(“键名”,”键值”);

正确答案：D

参考答案：D. html5中的Web Storage包括了两种存储方式：sessionStorage和localStorage。 sessionStorage用于本地存储一个会话（session）中的数据，这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储，仅仅是会话级别的存储。而localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。它们的用法是（key,value）或只有key。

4.在下列选项中，哪一个不是控件（）？

A 文本框

B 对象框

C 组合框

D 复选框

正确答案：B

5.定义页面结构如下

<html>

<head></head>

<body>

<div id="bgcolor" class="bgcolor"></div>

</body>

</html>

下面哪个语法表示将整个页面背景色设置为红色?（）

A body{color: red}

B .bgcolor{width:1366px; height:768px; background-color:red;}

C #bgcolor{width:100%; height:100%; background-color:red}

D body{background-color:red}

正确答案：D

6.关于XML，下面哪些描述是错误的：()

A 每个合格的XML都有唯一的根元素

B XML和Java,C/C++一样是门编程语言

C XML的格式上是要求严格的，每个元素的开闭必须完整，不允许交叉开闭，如

D XML常用于WebService中用来做数据交换的标准

E XML中元素是大小写敏感的

F XML中的数据可以通过XPATH检索查询

正确答案：B

7.下列哪些情况可触发reflow(回流/重排)?

A 改变块级元素的width/height

B 改变background-color

C visibility:hidden

D 改变font-size

正确答案：AD

8.以下位于<head>间的代码片段是做什么用的

1	`<meta name="viewport"` `content="width=device-width, initial-scale=1">`

A 使得页面编码合乎要求

B 表示支持响应式设计

C 支持正常的绘制和缩放

D 表示针对滚屏进行适当的适配

正确答案：BC

9.属于元素事件属性的是( )

A onblur

B required

C onfocus

D onsearch

正确答案：ACD

解析：onblur：元素失去焦点时触发

onfocus：元素聚焦时触发

onsearch：用户向搜索域或文本搜索时触发

10.关于页面加载过程，以下描述正确的有哪些？

A 页面加载 html 中的外联样式表时，不会阻塞后面的 JS 代码执行

B 由于 html 的层次结构已经是树状结构，因此可以实现边加载边生成 DOM 树

C 修改元素的颜色会造成重绘，同时触发回流

D 页面所有资源加载完毕后，会触发 onload 事件

正确答案：BD

解析：

css加载不会阻塞DOM树的解析
css加载会阻塞DOM树的渲染
css加载会阻塞后面js语句的执行

一个完整的网页加载流程：

(1)解析HTML结构

(2)加载外部脚本script和样式表文件link //页面中的多个脚本文件采用同步的方式加载会产生“线程等待”

(3)解析并执行脚本代码

(4)构建HTML DOM模型

(5)加载图片等外部资源文件 //图片等文件以异步线程的方式加载不会产生等待

(6)页面加载完毕

11.有如下 CSS 代码

div {

margin-top: 20px;

margin-right: 30px;

margin-bottom: 40px;

margin-left: 50px;

}

请问下列选项与该 div 实现了相同效果的是：（）

A div{margin: 20px 30px 40px 50px};

B div{margin: 20px 50px 40px 30px};

C div{margin: 20px 40px 50px 30px};

D div{margin: 20px 40px 30px 50px}.

正确答案：A

解析：当margin属性为四个参数时，分别代表：上、右、下、左外边距。

12.对于border-radius，说法错误的是

A 表示圆角边框

B IE8支持良好

C IE9支持良好

D firefox支持良好

正确答案：B

13.如果想要让一个P 标签，在1s内缓慢的以滑动方式隐藏，要怎么实现：

A $("p").slideUp(1000);

B $("p").slideDown(1000);

C $("p").mergeUp(1000);

D $("p").mergeDown(1000);

正确答案：A

解析：

slideup：隐藏；

slidedown:显示；

14.属于HTML5标签语意化的元素有 ()

A article、footer

B block

C section、banner

D header、nav

正确答案：AD

html5手册语义化标签：article、section、aside、hgroup、header、footer、nav、time、mark、figure、figcaption、contextmenu+menu

15.HTML5提供的数据存储有哪些？

A localStorage

B sessionStorage

C cookieStorage

D webStorage

正确答案：ABD

链接：HTML5提供的数据存储有哪些？_百度笔试题_牛客网
来源：牛客网

HTML5中增加了两种全新的数据存储方式：WebStorage和WebSQLDatabase。

WebStorage可用于临时或永久保存客户端的少量数据，WebSQLDatabase是客户端本地化的一套数据库系统，可以将大量的数据保存在客户端，无须与服务器端进行交互，极大地减轻了服务器端的压力。
WebStorage存储是HTML5为数据存储在客户端提供的一项重要功能，分为两种：sessionStorage(保存会话数据)和localStorage(在客户端长期保存数据)。

sessionStorage对象：使用sessionStorage对象在客户端保存的数据时间非常短暂，该数据实质上还是被保存在session对象中。用户在打开浏览器时，可以查看操作过程中要求临时保存的数据，一旦关闭浏览器，所有使用sessionStorage对象保存的数据将全部丢失。

保存：保存数据只需调用setItem()方法，格式：sessionStorage.setItem(key,value)。参数key表示被保存内容的键名，参数value表示被保存的内容。一旦键名设置成功，则不允许修改，不能重复，如果有重复的键名，只能修改对应的键值。
读取：读取被保存的数据，应该调用sessionStorage对象中getItem()方法，格式：sessionStorage.getItem(key)。该方法将返回一个指定键名对应的键值，如果不存在，则返回一个null值。

localStorage对象：长期在客户端保存数据，应该使用localStorage对象，使用该对象可以将数据长期保存在客户端，直至人工清除为止。

保存：保存数据调用对象中的setItem()方法，格式：localStorage.setItem(key,value)。
读取：与sessionStorage对象保存数据一样。读取数据调用对象中的getItem()方法，格式：localStorage.getItem(key)。与sessionStorage对象读取数据一样。 localStorage对象可以将内容长期保存在客户端，即使是重新打开浏览器也不会丢失。
清除：如果需要清除localStorage对象保存的内容，应该调用该对象的另一个方法removeItem()，格式：localStorage.removeItem(key)。一旦删除成功，与键名对应的相应数据将全部被删除。

16.在一个行内元素中，显示了不同的三部分内容，若想要这三个内容以 1:1:1 的比例分配宽度，该如何实现（）

A position:relative; -webkit-box-flex: 1; box-flex: 1; -webkit-flex:1; flex:1;

B position:absu; box-flex: 1; -webkit-flex:1; flex:1;

C position:relative; -webkit-box-flex: 1; box-flex: 1;

D position:relative; box-flex: 1; -webkit-flex:1; flex:1;

正确答案：A

链接：在一个行内元素中，显示了不同的三部分内容，若想要这三个内容以_京东笔试题_牛客网
来源：牛客网

box-flex 属性规定框的子元素是否可伸缩其尺寸。

伸缩元素能够随着框的缩小或扩大而缩写或放大。只要框中有多余的空间，可伸缩元素就会扩展来填充这些空间。

box-flex: value;

元素的可伸缩行。柔性是相对的，例如 box-flex 为 2 的子元素两倍于 box-flex 为 1 的子元素。

目前没有浏览器支持 box-flex 属性。

Firefox 支持替代的 -moz-box-flex 属性。

Safari、Opera 以及 Chrome 支持替代的 -webkit-box-flex 属性。

17.如何获取下面表单select域的选择部分的文本，其中obj=document.getElemById(“obj”)

<form name="a">

<select name="a" size="1" id=”obj”>

<option value="a">1</option>

<option value="b">2</option>

<option value="c">3</option>

</select>

</form>

A obj.options[obj.selectedIndex].text

B obj.options[obj.selectedIndex].value

C obj. value

D obj.text

正确答案：A

参考答案：A， <form name="a"> <select name="a" size="1" id=”obj”> <option value="a">1</option> <option value="b">2</option> <option value="c">3</option> </select> </form> 当前默认选中的是第一个， console.log( obj.options[obj.selectedIndex].text ) 输出的是1, console.log( obj.options[obj.selectedIndex].value ) 输出的是a。

18.下列哪个操作是W3C标准定义的阻止事件向父容器传递：

A e.preventDefault()

B e.cancelBubble=true

C e.stopPropagation()

D e.stopImmediatePropagation()

正确答案：C

解析：DOM中的事件对象：（符合W3C标准）

preventDefault() 取消事件默认行为

stopImmediatePropagation() 取消事件冒泡同时阻止当前节点上的事件处理程序被调用。

stopPropagation() 取消事件冒泡对当前节点无影响。

IE中的事件对象：

cancelBubble() 取消事件冒泡

returnValue() 取消事件默认行为

19.如果在catalog.htm中包含如下代码，则该HTML文档IE浏览器中打开后，用户单击此链接<A HREF="#novel">小说</a>将( )

A 使页面跳转到同一文件夹下名为“novel.html”的HTML文档

B 使页面跳转到同一文件夹下名为“小说.html”的HTML文档

C 使页面跳转到catalog.htm包含名为“novel”的锚记处

D 使页面跳转到同一文件夹下名为“小说.html”的HTML文档中名为“novel”的锚记处

正确答案：C

官方解析：超链接的 URL。可能的值：

绝对 URL - 指向另一个站点（比如 href="http://www.example.com/index.htm"）
相对 URL - 指向站点内的某个文件（href="index.htm"）
锚 URL - 指向页面中的锚（href="#top"）

20.当使用地图进行图像搜索时，可以把一幅图片从电脑桌面拖放到地图页面的输入框里，这是使用了HTML5的（）API实现的。

A history

B File

C system

D images

正确答案：B

官方解析：使用 type="file" 的 <input> 元素使得用户可以选择一个或多个元素以提交表单的方式上传到服务器上，或者通过 Javascript 的 File API 对文件进行操作。

21.以下哪个是在 HTML5 之前已经引入的特性？

A canvas/svg

B video

C 地理定位

D frames

正确答案：D
html5十大新特性的总结：
一、html5新特性之用于绘画的canvas元素
二、html5新特性之更加丰富强大的表单
三、html5新特性之用于媒介的video和audio元素
四、html5新特性之html5地理定位
五、html5新特性之html5拖放
六：html5新特性之html5 Web存储
七、html5新特性之html5应用程序缓存
八、html5新特性之html5 Web Workers
九、html5新特性之html5服务器发送事件
十、html5新特性之html5 WebSocket

链接：以下哪个是在 HTML5 之前已经引入的特性？__牛客网
来源：牛客网

html5总的来说比html4多了十个新特性，但其不支持ie8及ie8以下版本的浏览器

一、语义标签
html5语义标签，可以使开发者更方便清晰构建页面的布局
<header>    定义了文档的头部区域
<footer>     定义了文档的尾部区域
<nav>     定义文档的导航
<section>     定义文档中的节
<article>     定义文章
<aside>     定义页面以外的内容
<details>    定义用户可以看到或者隐藏的额外细节
<summary>    标签包含details元素的标题
<dialog>    定义对话框
<figure>    定义自包含内容，如图表
<main>    定义文档主内容
<mark>    定义文档的主内容
<time>    定义日期/时间
二、增强型表单
html5修改一些新的input输入特性，改善更好的输入控制和验证
输入类型    描述
color    主要用于选取颜***r /> date    选取日期
datetime    选取日期(UTC时间)
datetime-local    选取日期（无时区）
month    选择一个月份
week    选择周和年
time    选择一个时间
email    包含e-mail地址的输入域
number    数值的输入域
url    url地址的输入域
tel    定义输入电话号码和字段
search    用于搜索域
range    一个范围内数字值的输入域
html5新增了五个表单元素
<datalist>    用户会在他们输入数据时看到域定义选项的下拉列表
<progress>    进度条，展示连接/下载进度
<meter>    刻度值，用于某些计量，例如温度、重量等
<keygen>    提供一种验证用户的可靠方法,生成一个公钥和私钥
<output>    用于不同类型的输出,比如尖酸或脚本输出
html5新增表单属性
属性    描述
placeholder    输入框默认提示文字
required    要求输入的内容是否可为空
pattern    描述一个正则表达式验证输入的值
min/max    设置元素最小/最大值
step    为输入域规定合法的数字间隔
height/wdith    用于image类型<input>标签图像高度/宽度
autofocus    规定在页面加载时，域自动获得焦点
multiple    规定<input>元素中可选择多个值
三、音频和视频
html5提供了音频和视频文件的标准，既使用<audio>元素。
音频：<audio src=" "></audio>
视频：<video src=" "></video>
四、Canvas绘图
五、SVG绘图
什么是SVG?
SVG指可伸缩矢量图形

SVG用于定义用于网络的基于矢量的图形
SVG使用XML格式定义图形

SVG图像在放大或改变尺寸的情况下其图形质量不会有损失
SVG是万维网联盟的标准SVG的优势
与其他图像格式相比，SVG的优势在于：
SVG图像可通过文本编译器来创建和修改
SVG图像可被搜索、索引、脚本化或压缩
SVG是可伸缩的
SVG图像可在任何的分辨率下被高质量的打印
SVG可在图像质量不下降的情况下被放大
SVG与Canvas区别
*SVG适用于描述XML中的2D图形的语言
*Canvas随时随地绘制2D图形（使用javaScript）
*SVG是基于XML的，意味这可以操作DOM，渲染速度较慢
*在SVG中每个形状都被当做是一个对象，如果SVG发生改变，页面就会发生重绘
*Canvas是一像素一像素地渲染，如果改变某一个位置，整个画布会重绘。
Canvas    SVG
依赖分辨率    不依赖分辨率
不支持事件处理器    支持事件处理器
能够以.png或.jpg格式保存结果图像    复杂度会减慢搞渲染速度
文字呈现功能比较简单    适合大型渲染区域的应用程序
最合适图像密集的游戏    不适合游戏应用
六、地理定位
使用getCurrentPosition()方法来获取用户的位置。以实现“LBS服务”
七、拖放API
拖放是一种常见的特性，即捉取对象以后拖到另一个位置。
在html5中，拖放是标准的一部分，任何元素都能够拖放。
<div draggable="true"></div>
拖动生命周期    属性名    描述
拖动开始    ondragstart    在拖动操作开始时执行脚本
拖动过程中    ondrag    只要脚本在被拖动就运行脚本
拖动过程中    ondragenter    当元素被拖动到一个合法的防止目标时，执行脚本
拖动过程中    ondragover    只要元素正在合法的防止目标上拖动时，就执行脚本
拖动过程中    ondragleave    当元素离开合法的防止目标时
拖动结束    ondrop    将被拖动元素放在目标元素内时运行脚本
拖动结束    ondragend    在拖动操作结束时运行脚本
八、Web Worker

Web Worker可以通过加载一个脚本文件，进而创建一个独立工作的线程，在主线程之外运行。
Web Worker的基本原理就是在当前javascript的主线程中，使用Worker类加载一个javascript文件来开辟一个新的线程，
起到互不阻塞执行的效果，并且提供主线程和新县城之间数据交换的接口：postMessage、onmessage。
九、Web Storage
WebStorage是HTML新增的本地存储解决方案之一，但并不是取代cookie而指定的标准，cookie作为HTTP协议的一部分用来处理客户端和服务器的通信是不可或缺的，session正式依赖与实现的客户端状态保持。WebSorage的意图在于解决本来不应该cookie做，却不得不用cookie的本地存储。
websorage拥有5M的存储容量，而cookie却只有4K，这是完全不能比的。
客户端存储数据有两个对象，其用法基本是一致。
localStorage：没有时间限制的数据存储
sessionStorage:在浏览器关闭的时候就会清除。
localStorage.setItem(key,value);//保存数据
let value = localStorage.getItem(key);//读取数据

localStorage.removeItem(key);//删除单个数据
localStorage.clear();//删除所有数据
let key = localStorage.key(index);//得到某个索引的值
十、WebSocket
WebSocket协议为web应用程序客户端和服务端之间提供了一种全双工通信机制。
特点：（1）握手阶段采用HTTP协议，默认端口是80和443
（2）建立在TCP协议基础之上，和http协议同属于应用层
（3）可以发送文本，也可以发送二进制数据。

22.当使用HTML5的拖放API实现拖动时，需要监听”开始拖动”事件，此事件的名称是：

A dragstart

B dragend

C drop

D mousedown

正确答案：A

链接：当使用HTML5的拖放API实现拖动时，需要监听”开始拖动”_京东笔试题_牛客网
来源：牛客网

拖放

拖放是一种常见的特性，即抓取对象以后拖到另一个位置。

在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放。

首先，为了使元素可拖动，把 draggable 属性设置为 true

拖动什么 - ondragstart

放到何处 - ondragover

ondragover 事件规定在何处放置被拖动的数据。

进行放置 - ondrop

当放置被拖数据时，会发生 drop 事件

23.下列HTML代码中不符合HTML5语义化规范的是：

A <p><b>警告！以下代码可能包含威胁！</b></p>

B <p><dfn><abbr title="National Basketball Association">NBA</abbr></dfn>季后赛开赛</p>

C <ol>
<li>第一章</li>
<li>第二章</li>
<li>第三章
<ol>
<li>第3.1节</li>
<li>第3.2节</li>
</ol>
</li>
</ol>

D <article>
<hgroup>
<h1>文章标题</h1>
<h2>文章副标题</h2>
</hgroup>
<div class="content">
<p>文章内容</p>
<p>文章内容</p>
</div>
</article>

正确答案：A

官方解析：根据 HTML5 规范，在没有其他合适标签更合适时，才应该把 <b> 标签作为最后的选项。HTML5 规范声明：应该使用 <h1> - <h6> 来表示标题，使用 <em> 标签来表示强调的文本，应该使用 <strong> 标签来表示重要文本，应该使用 <mark> 标签来表示标注的/突出显示的文本。

24.下列哪些是浏览器支持的锚伪类：【多选】（）

A a:link

B a:disabled

C a:hover

D a:active

正确答案：ACD

链接：下列哪些是浏览器支持的锚伪类？_搜狐笔试题_牛客网
来源：牛客网

锚伪类

在支持 css 的浏览器中，链接的不同状态都可以不同的方式显示，这些状态包括：活动状态，已被访问状态，未被访问状态和鼠标悬停状态。用来表示链接不同状态的伪类就是锚伪类。

a:link {color: green;} /* 未访问的链接 */

a:visited {color: blue;} /* 已访问的链接 */

a:hover {color:orange;} /* 鼠标移动到链接上 */

a:active {color: yellow;} /* 选定的链接 */

几个伪类必须按照一定的顺序(l-v-h-a)，a:hover必须被置于a:link和a:visited之后，才是有效的；a:active必须被置于a:hover之后，才是有效的。
书写顺序很重要：a:link - a:visited - a:hover - a:actived。

25.请选出结构正确的选项

A <a href=www.nowcoder.com>牛客网</a>

B <a href="www.nowcoder.com">牛客网</a>

C <a href="http://www.nowcoder.com/">牛客网</a>

D <a href="http://www.nowcoder.com/">牛客网

正确答案：C

官方解析：超链接的 URL。可能的值：

绝对 URL - 指向另一个站点（比如 href="http://www.example.com/index.htm"）
相对 URL - 指向站点内的某个文件（href="index.htm"）
锚 URL - 指向页面中的锚（href="#top"）

26.浏览器在一次 HTTP 请求中，需要传输一个 4097 字节的文本数据给服务端，可以采用那些方式?

A 存入 IndexdDB

B 写入 COOKIE

C 放在 URL 参数

D 写入 Session

E 使用 POST

F 放在 Local Storage

正确答案：E

参考答案： IndexdDB 是 HTML5 的本地存储，把一些数据存储到浏览器（客户端）中，当与网络断开时，可以从浏览器中读取数据，用来做一些离线应用。 Cookie 通过在客户端 ( 浏览器 ) 记录信息确定用户身份，最大为 4 kb 。 url 参数用的是 get 方法，从服务器上获取数据，大小不能大于 2 kb 。 Session 是服务器端使用的一种记录客户端状态的机制。 post 是向服务器传送数据，数据量较大。 local Storage 也是 HTML5 的本地存储，将数据保存在客户端中（一般是永久的）。

27.哪个元素表示标记或突出显示的文本以供参考？

A highlight

B mark

C span

D blink

正确答案：B

官方解析：突出显元素指定文本的重要性，mark 元素表示标记或高亮显示以供参考的文档中的文本。

28.哪个元素创建了一组选项？

A <progress>

B <option>

C <optgroup>

D <select>

正确答案：C

官方解析：<optgroup> 元素在 <select>元素中创建一组选项，此元素不应嵌套。它包括全局属性，比如 disabled, label 等等。

29.问一份标准的HTML文档有哪几个必须的HTML标签？

A <html>

B <head>

C <title>

D <body>

正确答案：ABCD

30.input 元素的哪个属性将元素的值设置为表示一定范围内的数字？

A range

B emile

C file

D data

正确答案：A

官方解析：具有 type 属性的 input 元素，其值为 “range”，表示将元素的值设置为包含一定范围内数字值的输入域。

31.如果一个HTML文档内含有阿拉伯文，则应该？

A 使用GBK编码

B 使用utf-8编码

C 使用iso-8859-2编码

D 将阿拉伯文转为图片并嵌入到文档内

正确答案：B

官方解析：UTF-8（8-bit Unicode Transformation Format）是一种针对Unicode的可变长度字符编码，又称万国码。UTF-8使用1~4字节为每个字符编码。用在网页上可以同一页面显示中文简体繁体及其它语言（如英文，日文，韩文）。

GBK是汉字编码，是双字节码，可表示繁体字和简体字。

32.下列描述错误的是（）

A HTTP状态码302表示暂时性转移

B domContentLoaded事件早于onload事件

C IE6/7/8不支持事件捕获

D localStorage存储的数据，在刷新页面后会消失

正确答案：D

参考答案：答案：D Localstorage是html5存储数据的方式，在HTML5中，本地存储是一个window的属性，包括localStorage和sessionStorage。HTML5本地存储只能存字符串，任何格式存储的时候都会被自动转为字符串，所以读取的时候，需要自己进行类型的转换。是永久性存储，当然用户可以通过浏览器设置来删除。

33.

1 2	`<input` `type="date"` `name="bday">` `<input` `type="datetime-local"` `name="bdaytime">`

关于上面两行代码显示结果说法错误的是（）

A 两者都可以用来绘制日历

B 后者可以显示本地时间，且时间不可以修改

C 日历的样式可以通过CSS进行修改

D 日历标签可以应用于目前主流浏览器

正确答案：B

34.需要创建一个多选框，且和文本关联起来（单击文本就像单击核选框一样）。下列 HTML 代码中，正确的是？（）

A <label><input type="checkbox" />记住我</label>

B <input type="checkbox" /><label for="checkbox">记住我</label>

C <input type="checkbox" id="c1" /><label>记住我</label>

D <input type="checkbox" id="c1" /><label for="c1">记住我</label>

正确答案：AD

官方解析：<input type="checkbox" id="c1" /><label for="c1">记住我</label>

35.以下正确表示10^2的是

A 10<sub>2</sub>

B 10<sup>2</sup>

C 10<mark></mark>

D 10*2

正确答案：B

解析：包含在 <sup> 标签和其结束标签 </sup> 中的内容将会以当前文本流中字符高度的一半来显示，但是与当前文本流中文字的字体和字号都是一样的。

<sup></sup>上标

<sub></sub>下标

<mark></mark>突出显示

36.在实际使用中，下面哪一个可以很方便的获得页面中定义的HTML对象？（）

A document.GetElementsByTagName

B document.getElementByTagNames

C document.getElementsById

D document.getElementById

正确答案：D

解析：获取Element对象的方法：

1. getElementById() ：根据id属性值获取元素对象。id属性值一般唯一

2. getElementsByTagName()：根据元素名称获取元素对象们。返回值是一个数组
3. getElementsByClassName():根据Class属性值获取元素对象们。返回值是一个数组
4. getElementsByName(): 根据name属性值获取元素对象们。返回值是一个数组

37.下面哪些标签可以在HTML页面中插入GIF动画和MP3声音文件？（）

A <image>和<audio>

B <image>和<voice>

C <img>和<voice>

D <img>和<audio>

正确答案：D

38.下列说法错误的是：

A 在 Blink 和 WebKit 的浏览器中，某个元素具有 3D 或透视变换（perspective transform）的 CSS 属性，会让浏览器创建单独的图层。

B 我们平常会使用 left 和 top 属性来修改元素的位置，但 left 和 top 会触发重布局，取而代之的更好方法是使用 translate，这个不会触发重布局。

C 移动端要想动画性能流畅，应该使用 3D 硬件加速，因此最好给页面中的元素尽量添加 translate3d 或者 translateZ(0) 来触发 3D 硬件加速。

D 解决浏览器渲染的性能问题时，首要目标就是要避免层的重绘和重排。

正确答案：C

非常详细的解释： https://segmentfault.com/a/1190000000490328#articleHeader4

39.下列哪些属性是不可以被继承的()

A margin

B position

C float

D font-size

正确答案：ABC

链接：下列哪些属性是不可以被继承的()_用友网络笔试题_牛客网
来源：牛客网

可以被继承的属性：字体系列：font-family，font-size，font-style，font-weight，font-stretch，font-size-adjust；列表相关：list-style，list-style-image，list-style-position，list-style-type，list-style-color；文本系列：text-indent，text-align，line-height，word-spaceing，letter-spacing，text-transform，direction，color；元素可见性：visibility；表格布局：caption-side，border-collapse，border-spacing，empty-cells，table-layout；生成内容：quotes；光标属性：cursor；页面样式：page，page-break-inside，Windows，orphans；声音样式属性：speak、speak-punctuation、speak-numeral、speak-header、speech-rate、volume、voice-family、pitch、pitch-range、stress、richness、、azimuth、elevation。

40.元素的alt和title属性有什么异同，选出正确的说法？

A 不同的浏览器，表现一样

B alt和title同时设置的时候，alt作为图片的替代文字出现，title是图片的解释文字

C alt和title同时设置的时候，title作为图片的替代文字出现，alt是图片的解释文字

D 以上说法都不正确

正确答案：B

官方解析：

alt

text

规定图像的替代文本。

41.以下哪个标签用于表示 HTML5 中不同类型输出的结果？

A output

B placeholder

C autofocus

D required

正确答案：A

42.在HTML5中，空标签可以不写自关闭的斜线（/）了，这些标签不包括以下哪项？

A img

B button

C br

D input

正确答案：B

官方解析：<button>X</button> 内容X是按钮的显示内容，该元素必须闭合。

43.以下不属于空元素（void elements）的是：

A embed

B img

C address

D wbr

正确答案：C

链接：以下不属于空元素（void elements）的是：_360笔试题_牛客网
来源：牛客网

一个空元素（empty element）可能是 HTML，SVG，或者 MathML 里的一个不可能存在子节点（例如内嵌的元素或者元素内的文本）的element。

HTML，SVG 和 MathML 的规范都详细定义了每个元素能包含的具体内容（define very precisely what each element can contain）。许多组合是没有任何语义含义的，比如一个 <audio> 元素嵌套在一个 <hr> 元素里。

在 HTML 中，通常在一个空元素上使用一个闭标签是无效的。例如， <input type="text"></input> 的闭标签是无效的 HTML。

在 HTML 中有以下这些空元素：

<wbr>

https://developer.mozilla.org/zh-CN/docs/Glossary/%E7%A9%BA%E5%85%83%E7%B4%A0

44.下列哪些是正确的引入CSS样式到html中的方式? ()

A <link rel="stylesheet" type="text/css" href="test.css">

B <link rel="stylesheet" type="text/css" src="mystyle.css">

C <style type=”text/css”>body{color:red}</style>

D <style type=“text/css" src="test.css"></style>

正确答案：AC

BD选项：后边不能用src引入

45.HTML 语言是一种( )

A 标注语言

B 机器语言

C 汇编语言

D 算法语言

正确答案：A

官方解析：

HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

46.在 HTML5 中，哪个元素用于组合标题元素？

A <group>

B <header>

C <headings>

D <hgroup>

正确答案：D

官方解析：<hgroup> 标签用于对网页或区段（section）的标题进行组合。

47.以下对form表单中input元素的readonly与disabled属性描述正确的是？（）

A Readonly为真时，脚本无法修改input的值

B Disabled为真时，脚本无法修改input的值

C Readonly为真时，input的值不会随着表单提交

D Disabled为真时，input的值不会随着表单提交

正确答案：D

参考答案： disabled指当 input 元素加载时禁用此元素。input内容不会随着表单提交 readonly规定输入字段为只读。input内容会随着表单提交。无论设置readonly还是disabled，通过js脚本都能更改input的value（亲测可以）。

48.下面关于DOM事件描述错误的是：

A onload() 元素被载入(文档，框架或图像)

B onclick() 鼠标点击一个元素时触发

C onchange() 元素在页面的位置发生改变时触发

D onblur() 元素发生变化时触发

E onreset() 表单元素被重置，比如当用户按下表单重置按钮

正确答案：CD

链接：下面关于DOM事件描述错误的是：_京东笔试题_牛客网
来源：牛客网

onload() 元素被载入(文档，框架或图像)

onclick() 鼠标点击一个元素时触发

onreset() 表单元素被重置，比如当用户按下表单重置按钮

onchange() 事件会在域的内容改变时发生,事件也可用于单选框与复选框改变后触发的事件

onblur() 事件会在对象失去焦点时发生,经常用于Javascript验证代码，一般用于表单输入框

49.下列哪些是块级元素（）

A input

B ul

C hr

D li

E div

F form

正确答案：BCDEF

50.哪个元素表示给定范围内的标量值？

A <option>

B <meter>

C <label>

D <input>

正确答案：B

官方解析：<meter> 元素表示已知范围内的标量值或阶乘值。它包括全局属性，如min、max、value、optimal、low、high、form等。

51.下面说法正确的有( )

A P元素不能包含div

B li元素的祖先元素可能是li，但父元素不可能是li

C Dom Tree的根节点是body元素

D a元素可以包含img

正确答案：ABD

52.以下是Video/Audio中会触发的事件的有？

A load

B play

C seeked

D abort

正确答案：BCD

方法：load() play() pause()
事件：play() playing() pause() seeked() seeking() abort()当音频/视频的加载已放弃时触发