北大青鸟设计培训:常见的html面试问题都有哪些?

html-css035

北大青鸟设计培训:常见的html面试问题都有哪些?,第1张

对于许多刚刚毕业的大学生来说,前端编程开发程序员的职业发展趋势还是非常不错的,而今天佳音北大青鸟http://www.kmbdqn.cn/就一起来了解一下,前端编程开发技术面试中常见的html面试问题都有哪些。

1.对web标准的理解是什么?先是html标签上,标签闭合,标签小写,不乱嵌套使用语义化标签,例如header,article,少用b这样没有语义的标签,以提高搜索几率使用外部的css文件及js文件,使结构表现行为分离减少文件数目,达到减少网络请求次数,文件下载与页面速度更流畅内容能被更多的用户及设备访问,保证在版本较低的浏览器下能够呈现完整内容,在版本高的浏览器上能够展现更完美的视觉效果代码低耦合高内聚,易维护。

2.HTTP状态码及其含义?100-119:接收成功,要求客户端继续提交下一次请求200-299:接收成功且完整处理了整个过程。

300-399:客户需要进一步细化:302:重定向304/307:拿缓存400-499:请求出错不能执行404:请求资源没在web服务器中403:没有权限,拒绝访问500-599:服务器端错误503:由于临时的服务器维护或者过载,服务器当前无法处理请求。

500:服务器遇到了一个未曾预料的状况,导致了它无法完成对请求的处理。

一般来说,这个问题都会在服务器的程序码出错时出现。

3.你所知道的HTTP请求方法?GET:请求指定页面的信息,并返回实体主体。

HEAD:类似于GET请求,只不过返回的响应没有具体内容,用于获取报头POST:向指定资源提交数据请求处理(例如表单或上传文件)。

数据被包含在请求体中。

POST请求可能导致新资源的建立/或已有资源的修改。

PUT:从客户端向服务器传送的数据取代指定的文档的内容。

DELETE:请求服务器删除指定的页面。

CONNECT:HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。

OPTIONS:允许客户端查看服务器的性能TRACE回显服务器收到的请求,主要用于测试或诊断

HTML

1.对WEB标准以及W3C的理解与认识

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维 护、改版方便,不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;

2.xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言

最主要的不同:

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义?

用于声明文档使用那种规范(html/Xhtml)一般为 严格 过度 基于框架的html文档

加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug

4.行内元素有哪些?块级元素有哪些?

块级元素:div p h1 h2 h3 h4 form ul

行内元素: a b br i span input select

5.HTML全局属性(global attribute)有哪些

参考资料:MDN: html global attribute或者W3C HTML global-attributes

accesskey

:设置快捷键,提供快速访问元素如aaa在windows下的firefox中按alt + shift + a

可激活元素

class

:为元素设置类标识,多个类名用空格分开,CSS和javascript可通过class属性获取元素

contenteditable

: 指定元素内容是否可编辑

contextmenu

: 自定义鼠标右键弹出菜单内容

data-*

: 为元素增加自定义属性

dir

: 设置元素文本方向

draggable

: 设置元素是否可拖拽

dropzone

: 设置元素拖放类型: copy, move, link

hidden

: 表示一个元素是否与文档。样式上会导致元素不显示,但是不能用这个属性实现样式效果

id

: 元素id,文档内唯一

lang

: 元素内容的的语言

spellcheck

: 是否启动拼写和语法检查

style

: 行内css样式

tabindex

: 设置元素可以获得焦点,通过tab可以导航

title

: 元素相关的建议信息

translate

: 元素和子孙节点内容是否需要本地化

6.什么是web语义化,有什么好处

web语义化是指通过HTML标记表示页面包含的信息,包含了HTML标签的语义化和css命名的语义化。 HTML标签的语义化是指:通过使用包含语义的标签(如h1-h6)恰当地表示文档结构 css命名的语义化是指:为html标签添加有意义的class,id补充未表达的语义,如Microformat通过添加符合规则的class描述信息 为什么需要语义化:

去掉样式后页面呈现清晰的结构

盲人使用读屏器更好地阅读

搜索引擎更好地理解页面,有利于收录

便团队项目的可持续运作及维护

7.html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

新特性:

HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加。

拖拽释放(Drag and drop) API

语义化更好的内容标签(header,nav,footer,aside,article,section)

音频、视频API(audio,video)

画布(Canvas) API

地理(Geolocation) API

本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;

sessionStorage 的数据在浏览器关闭后自动删除

表单控件,calendar、date、time、email、url、search

新的技术webworker, websocket, Geolocation

移除的元素:

纯表现的元素:basefont,big,center,font, s,strike,tt,u;

对可用性产生负面影响的元素:frame,frameset,noframes;

支持HTML5新标签:

IE8/IE7/IE6支持通过 document.createElement 方法产生的标签,可以利用这一特性让这些浏览器支持 HTML5 新标签,浏览器支持新标签后,还需要添加标签默认的样式(当然最好的方式是直接使用成熟的框架、使用最多的是html5shiv框架):

如何区分:

DOCTYPE声明新增的结构元素、功能元素

8. HTML5 存储类型有什么区别?

HTML5 能够本地存储数据,在之前都是使用 cookies 使用的。HTML5 提供了下面两种本地存储方案:

localStorage - 没有时间限制的数据存储,数据永远不会过期,关闭浏览器也不会丢失

sessionStorage - 针对一个 session 的数据存储,同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。

9. HTML5 标准提供了哪些新的API?

1:canvas,不用多说,可以画出很多绚丽的图形,甚至可以直接做出伪3D游戏。

2:媒体控制,也很好理解(直译就是回放功能,假如只用html5.0以下的标签写,以前的音乐播放是不可能实现滚动条的。)

3:离线网页程序,可以把资源文件完全缓存在客户端,并且通过js的一些方法清空缓存

4:文档编辑,应该是更好的支持对文档的编辑。

5:拖动,可以将文件拖动到某些区域上传

6:跨文档请求,websocket,一种更加高效的通讯方式

7:历史管理,可以通过js管理和插入历史记录

8:MIME头自定义

9:客户端数据存储,localstoage sessionstoage

10:地理位置共享

11:本地数据库

12:索引数据库

10.HTML5 应用程序缓存和浏览器缓存有什么区别?

HTML5 引入了应用程序缓存,这意味着 web 应用可进行缓存,并可在没有因特网连接时进行访问。

应用程序缓存为应用带来三个优势:

离线浏览 - 用户可在应用离线时使用它们

速度 - 已缓存资源加载得更快

减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。

11.常用那几种浏览器测试?有哪些内核(Layout Engine)?

(Q1)浏览器:IE,Chrome,FireFox,Safari,Opera。

(Q2)内核:Trident,Gecko,Presto,Webkit。

12.请描述一下 cookies,sessionStorage 和 localStorage 的区别?

cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage不会

sessionStorage和localStorage的存储空间更大;

sessionStorage和localStorage有更多丰富易用的接口;

sessionStorage和localStorage各自独立的存储空间;

13.如何实现浏览器内多个标签页之间的通信?

调用localstorge、cookies等本地存储方式

14.请写出localStorage对象的常用方法。

存储 - localStorage.setItem(key, value) - 如果key存在,更新value

获取 - localStorage.getItem(key) - 如果key不存在,返回null

删除 - localStorage.removeItem(key) - 删除key对应的数据

全部清除 - localStorage.clear() - 清空localStorage中所有数据

遍历 - localStorage.length

遍历 - localStorage.key(index)

15.如何在HTML5中启用应用程序缓存?

<html manifest="fileName.appcache">

每个指定了manifest的页面在用户对其访问时都会被缓存。

.appcache是manifest文件的扩展名

16.html5 离线存储

Html5的一个重要特性就是离线存储,所谓的离线存储就是将一些资源文件保存在本地,这样后续的页面重新加载将使用本地资源文件,在离线情况下可以继续访问web应用,同时通过一定的手法(更新相关文件或者使用相关API),可以更新、删除离线存储等操作。

Html5的离线存储使用一个manifest文件来标明哪些文件是需要被存储的,使用如 <html manifest='offline.manifest'>来引入一个manifest文件,这个文件的路径可以是相对的,也可以是绝对的,如果你的web应用很多,而且希望能集中管理manifest文件,那么静态文件服务器是个不错的选择。

17.HTML5 Canvas 元素有什么用?

Canvas 元素用于在网页上绘制图形,该元素标签强大之处在于可以直接在 HTML 上进行图形操作

其实,不管是什么样的面试形,问的问题都差不多,万变不离其宗,都有规律可寻。其实对所有的面试官而言,只有一个目的:在最短的时间里了解到你最多的信息。想高效率的准备面试,先从这七个大方面着手吧!

一、基本情况

1、请用最简洁的语言描述您从前的工作经历和工作成果。

二、专业背景

您认为此工作岗位应当具备哪些素质?

三、工作模式

您平时习惯于单独工作还是团队工作?

四、价值取向

您对原来的单位和上司的看法如何?

五、资质特性

您如何描述自己的个性?

六、薪资待遇

是否方便告诉我您目前的待遇是多少?

七、背景调查

您是否介意我们通过您原来的单位迚行一些调查?

95%的面试基本上都离不开这些问题,当然还有可能问一些专业问题,我想如果你做过的话应该都不是什么难事,一般面试官都不会过多的问专业方面的问题的。以上信息直接参考楚湘人才网面试宝典篇之化繁为简,把HR的上百道问题汇总成七大类和面试常问经典问题。更多更全面的面试资讯 面试技巧 面试问题请登陆楚湘人才网或关注微信公众平台:楚湘人才网