没有合适的资源?快使用搜索试试~ 我知道了~
首页HTML5面试题面试整理(含答案)最新版.docx
资源详情
资源评论
资源推荐

HTML5 面试题
一、 Doctype 的作用? 严格模式和混杂模式的区分,以及如何触发这 2
种模式?
声明位于文档中的最前面,处于 标签之前。告知浏览器的解
析器,用什么文档类型 规范来解析这个文档。
不存在或格式不正确会导致文档以混杂模式呈现。
严格模式就是浏览器根据 标准去解析页面,是一种要求严格的 ,不允许使
用任何表现层的语法,
混杂模式是一种向后兼容的解析方法。
触发标准模式或者说严格模式很简单,就是 前申明正确的 ,出发混杂模式
可以在 文档开始不声明 ,或者在 前加入 声明
二、 请写出至少 20 个 HTML5 标签
!"#!"!"#$%"$
%##"
三、 语义化的理解?
&' 语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析;
('在没有样式 ) 情况下也以一种文档格式显示,并且是容易阅读的。
*'搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于 )。
+'使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。
四、 列举 5 种 IE haslayout 的属性及其值
%是 ,-.# 渲染引擎的一个内部组成部分。在 -
.# 中,一个元素要么自己对自身的内容进行计算大小和组织,要么依赖于父元
素来计算尺寸和组织内容。为了调节这两个不同的概念,渲染引擎采用 了 %
的属性,属性值可以为 或 !。当一个元素的 %属性值为 时,我们
说这个元素有一个布局(%)
部分的 -显示的错误,都可以通过激发元素的 %属性来修正。可以通过设
置 尺寸属性/0"1等来激发元素的 %,使其“拥有布局”。如下所示,
通过设置以下 属性即可。
* display: inline 一 block
* height: (任何值除了 auto)
* float: (left 或 right)
* position: absolute
* width: (任何值除了 auto)
* writing 一 mode: tb 一 rl;(实现文字可以垂直显示,具体意义可百度了解)
&

* zoom: (除 normal 外任意值)
-.#2还有一些额外的属性/不完全列表13
* min 一 height: (任意值)
* max 一 height: (除 none 外任意值)
* min 一 width: (任意值)
* max 一 width: (除 none 外任意值)
* overflow: (除 visible 外任意值)
* overflow 一 x: (除 visible 外任意值)
* overflow 一 y: (除 visible 外任意值)
* position: fixed
五、 简述 jpg,gif,png-8,png-24 的区别,及其各自的使用场景
"!、4#"、#" 格式的图片在网站制作中的区别
Gif 格式特点3
&'透明性56! 是一种布尔透明类型,既它可以是全透明,也可以是全不透明,但是
它并没有半透明(# 透明)。
('动画56! 这种格式支持动画。
*'无损耗性56! 是一种无损耗的图像格式,这也意味着你可以对 "! 图片做任何操
作也不会使得图像质量产生损耗。
+'水平扫描56! 是使用了一种叫作 7, 的算法进行压缩的,当压缩 "! 的过程中,
像素是由上到下水平压缩的,这也意味着同等条件下,横向的 "! 图片比竖向的 "! 图片
更加小。例如 899:&9 的图片比 &9:899 的图片更加小
8'间隔渐进显示56! 支持可选择性的间隔渐进显示
由以上特点看出只有 (8; 种颜色的 "! 图片不适合照片,但它适合对颜色要求不高
的图形(比如说图标,图表等),它并不是最优的选择,我们会在后面中看到 #" 是
最优的选择。
Jpeg(jpg)格式特点3
&'透明性5它并不支持透明。
('动画5它也不支持动画。
*'损耗性5除了一些比如说旋转(仅仅是 <9、&=9、(29 度旋转),裁切,从标准
类型到先进类型,编辑图片的原数据之外,所有其它操作对 4#" 图像的处理都会使得
它的质量损失。所以我们在编辑过程一般用 #" 作为过渡格式。
+'隔行渐进显示5它支持隔行渐进显示(但是 浏览器并不支持这个属性,但是
会在整个图像信息完全到达的时候显示)。
由上可以看出 >#" 是最适 上面的摄影图片和数字照相机中。
Png 格式特点3
&'类型5" 这种图片格式包括了许多子类,但是在实践中大致可以分为 (8; 色的
#" 和全色的 #",你完成可以用 (8; 色的 #" 代替 "!,用全色的 #" 代替 4#"
('透明性5" 是完全支持 # 透明的(透明,半透明,不透明),尽管有两个
(

怪异的现象在 ;(下面详细讨论)
*'动画5它不支持动画
?6 图片格式现在包含三种类型:
&'?6=(8; 色 ?6 的别名
('?6(+ 全色 ?6 的别名
*'?6*( 全色 ?6 的别名
基本上 ?6*( 就是 ?6(+,但是附带了全 # 通道。就是说每个像素上不仅
存储了 (+ 位真色彩信息还存储了 = 位的 # 通道信息,就如同 6-@ 能存储透明和不
透明信息一样。当我们把图片放到不太搭配的背景上的时候,透明 ?6 图片的边缘会
显示得更加平滑。
当然,我也知道你的想法,“但是 # 也能生成带透明通道的 ?6 图片!”
我也知道,它只是表面上这么说是 ?6(+,让我也产生困惑了。
作为一个伤感的 @$ 倡导者,我只使用 ?6*( 支持附带 # 通道的真色
彩图片。不管怎样,如果你习惯使用 #,你就应该知道,# 在“存储
为 ,A 格式”中只提供 ?6= 和 ?6(+ 两种 ?6 格式。
我敢肯定你经常会勾选“支持透明”选项,以获得带有透明度的 ?6 图片,但是这
样你就获取了一张 ?6*( 图片。——# 只是觉得把 ?6*( 这个名称给隐藏
掉了。。。。
对 #"= 的误解
"= 的在 中的怪异表现:
半透明的 #"= 在 ; 以下的浏览器显示为全透明。
B# 透明的全色 ?6(#"*()在 ; 中会出现背景颜色(通常是灰色)。
由上面可以总结:
()全透明的 #"= 可以在任一浏览器正常显示(就像 "! 一样)。半透明的
#"= 在除了 ; 及其以下的浏览器下错误的显示成全透明,其它浏览器都能正常显示
半透明。这个 " 并不需要特殊对待,因为在不支持半透明的浏览器下只是显示为全
透明,对用户体验影响不大,它反而是透明 "! 的加强版。
()第二个 " 没有什么好的方法解决,只能通过影响性能的方法
B#-" 与需要加特殊标签(C)。
因此得出结论就是:请使用 ?6=。
"= 的软件问题:
# 只能导出布尔透明的 ?6=。
@$ 既能导出布尔透明的 ?6=,也能导出 # 透明的 ?6='
六、 能够设置文本加粗的样式属性是什么
字体加粗(! 一 ")
功能:用于设置字体笔划的粗细。
属性值:正常度 一
相对度 一 55"5"
渐变度 一 &995(995*995+99/相当于 158995;995299/相当于 、
"、 、以及数值 &99-<99。
*

语法为:&D! 一 "3属性值E
七、 Html 和 xhtml 有什么区别?
是一种基本的 网页设计语言,. 是一个基于 的置标语言。
最主要的不同3
元素必须正确的被嵌套,元素必须关闭,标签必须小写,必须有根元素。
八、 算法题:有一个长度为 n 一 1 的数组,包含 1 一 n 中不重复的乱序
的数,求寻找范围内不在数组中的数,考虑空间占用,性能优化,溢出
等情况,至少写两个算法
F当 不太大时,可以考虑求和。先算出 &G 的所有数的和,然后减去数组中出现的
所有自然数的和。时间复杂度为 /1,空间复杂度 /&1。这种方法的缺点是 不能太
大, 比较大时,求和容易溢出。
用位图。从头到尾的扫描整个数组,把出现的数相应的位设置为 &'然后再扫描位图,
找出不为 & 的那一位,即为要找的数。这种方法的时间复杂度为 /15空间复杂度为
/1。
异或有个很巧妙的地方:同一变量和该变量与另一变量的异或值的异或等于这个变
量自身。所以我们可以把 &G 的所有数异或,再把数组中出现的所有数异或,然后再
把这两个异或的结果异或,最后得到的值即为我们要找的值。这样时间复杂度为 /15
空间复杂度为 (&)。在空间上比第二种方法要好,而且不会出现第一种方法中所说
的溢出问题。
九、 实现以下方法(与标准一致)
'#%#'"A%?:
Element.prototype.getElementsByClassName = function(searchClass, node, tag) {
if (document.getElementsByClassName) {
var nodes = (node || document).getElementsByClassName(searchClass),
result = [];
for (var i = 0; node = nodes[i++]; ) {
if (tag !== "*" && node.tagName === tag.toUpperCase()) {
result.push(node);
}
}
return result;
} else {
node = node || document;
tag = tag || "*";
var classes = searchClass.split(" "),
elements = (tag === "*" && node.all) ? node.all :
node.getElementsByTagName(tag),
+

patterns = [],
current,
match;
var i = classes.length;
while (一一 i >= 0) {
patterns.push(new RegExp("(^|\\s)" + classes[i] + "(\\s|$)"));
}
var j = elements.length;
while (一一 j >= 0) {
current = elements[j];
match = false;
for (var k = 0, kl = patterns.length; k < kl; k++) {
match = patterns[k].test(current.className);
if (!match)
break;
}
if (match)
result.push(current);
}
return result;
}
}
@'#%#':
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
throw new TypeError("bind function error");
}
var aArgs = Array.prototype.slice.call(arguments,1),
fToBind = this,
fBound = function () {
return fToBind.apply(oThis ||
window,aArgs.concat(Array.prototype.slice.call(arguments)));
};
return fBound;
};
十、 编写一个方法去掉一个数组的重复元素
&'遍历数组法
8
剩余63页未读,继续阅读









前端小能手i
- 粉丝: 18
- 资源: 1
上传资源 快速赚钱
我的内容管理 收起
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助

会员权益专享
最新资源
- Xilinx SRIO详解.pptx
- Informatica PowerCenter 10.2 for Centos7.6安装配置说明.pdf
- 现代无线系统射频电路实用设计卷II 英文版.pdf
- 电子产品可靠性设计 自己讲课用的PPT,包括设计方案的可靠性选择,元器件的选择与使用,降额设计,热设计,余度设计,参数优化设计 和 失效分析等
- MPC5744P-DEV-KIT-REVE-QSG.pdf
- 通信原理课程设计报告(ASK FSK PSK Matlab仿真--数字调制技术的仿真实现及性能研究)
- ORIGIN7.0使用说明
- 在VMware Player 3.1.3下安装Redhat Linux详尽步骤
- python学生信息管理系统实现代码
- 西门子MES手册 13 OpcenterEXCR_PortalStudio1_81RB1.pdf
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈



安全验证
文档复制为VIP权益,开通VIP直接复制

评论0