1.XHTML和HTML有什么区别
HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言。最主要的不同:
(1)XHTML元素必须被正确地嵌套
(2)XHTML元素必须被关闭
(3)XHTML标签名必须用小写字母
(4)XHTML文档必须拥有根元素
2.什么是语义化的HTML?
html5的语义化是指用正确的标签包含正确的容,比如nav标签就应该包含导航条容
(1)直观的认识标签对于搜索引擎的抓取有好处,用正确的标签做正确的事情!
(2)html语义化就是让页面的容结构化,便于对浏览器、搜索引擎解析
(3)在没有CCS样式情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下和各个关键字的权重,利于SEO。
(4)使阅读源代码的人更容易将分块,便于阅读维护理解。
写一段语义的html代码(HTML5中新增加的很多标签如:
< div id="header">
< h1>标题< /h1>
< h2>专注Web前端技术< /h2>
< /div>
语义HTML 具有以下特性:
文字包裹在元素中,用以反映容。例如:
段落包含在
元素中。
顺序表包含在
从其他来源引用的大型文字块包含在
元素中。HTML 元素不能用作语义用途以外的其他目的。例如:
包含标题,但并非用于放大文本。
包含大段引述,但并非用于文本缩进。空白段落元素(
) 并非用于跳行。文本并不直接包含任何样式信息。例如:
不使用 或
等格式标记。 类或ID 中不引用颜色或位置。
3.常见的浏览器核有哪些?
Trident核:IE, Max Thon, TT, The World,360,搜狗浏览器等。[又称MSHTML]
Gecko核:Netscape6及以上版本,FF, Mozilla Suite / Sea Monkey等
Presto核:Opera7及以上。[Opera核原为:Presto,现为:Blink;]
Webkit核:Safari, Chrome等。[ Chrome的:Blink(WebKit的分支)]
4.HTML5有哪些新特性、移除了那些元素?如何区分HTML 和HTML5?
HTML5 现在已经不是SGML 的子集。
主要是关于图像,位置,存储,多任务等功能的增加:
(1)标签语义化(如header,footer,nav,aside,article,section),新增很多表单元素,如email,url
(2)音视频元素video, audio不需要在依赖外部的插件就可以往网页中加入音/视频元素
(3)新增很多api如获取用户地理位置的window.navigator.geoloaction
(4) webstorage 本地存储,存储在客户端,包括localeStorage和sessionStorage
(5)websocket一种协议,可以让我们建立客户端到服务器端的全双工通信,这就意味着服
务器端可以主动推送数据到客户端
(6) webworker是运行在浏览器后台的js程序,是另开的一个线程,不影响主程序运行
可用webworker执行复杂的数据操作,再把操作结果通过postMessage传递给主线程
这样在进行复杂且耗时的操作时就不会阻塞主线程了
(7)缓存html5允许我们自己控制哪些文件需要缓存,哪些不需要,具体的做法如下:
1) 首先给html添加manifest属性,并赋值为cache.manifest
2) cache.manifest的容为:
CACHE MANIFEST
#v1.2
CACHE : //表示需要缓存的文件
a.js
b.js
NETWORK: //表示只在用户在线的时候才需要的文件,不会缓存
c.js
FALLBACK //表示如果找不到第一个资源就用第二个资源代替
index.html
移除的元素:
纯表现的元素basefont,big,center,font, s,strike,tt,u;
对可用性产生负面影响的元素frame,frameset,noframes;
多个页面之间如何进行通信
使用cookie,使用web worker,使用localeStorage和sessionStorage
5.区分HTML和HTML5
a在文档类型声明上, html有很长的一段代码,html5却只有简单的声明html:
html5:
b在结构语义上
html没有体现结构语义化的标签通常都是
这样来命名的,这样表示的头部。Html5有体现结构语义化的标签
(处理HTML5新标签的浏览器兼容问题最好的方式是直接使用成熟的框架如html5shim)
6.请描述一下cookies,sessionStorage 和localStorage 的区别?
cookie存储在客户端
大小受限,并且每次你请求一个新的页面时Cookie都会被发送,浪费带宽。
需指定作用域,不可以跨域调用。
有一定的过期时间,过期后自动会消失
作用是与服务器进行交互,作为HTTP规的一部分而存在
web Storage存储在客户端
是为更大容量存储设计的(8M, cookie 4K)
拥有setItem,getItem,removeItem,clear等方法(cookie需要开发者自己封装setCookie,getCookie)
作用是在本地“存储”数据
sessionStorage会话级别的存储,仅用于在本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
7.如何实现浏览器多个标签页之间的通信?
调用localstorge、cookies等本地存储方式。
8.HTML5 为什么只需要写!DOCTYPE HTML?
HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型
HTML5 不基于SGML,因此不需对DTD进行引用,但需要doctype来规浏览器的行为(让浏览器按照它们应该的方式来运行)。
9.Doctype作用?标准模式与兼容模式各有什么区别?
!DOCTYPE声明位于HTML文档第一行,处于html 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。
DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。
标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。
在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。
10.Doctype中区分严格模式与混杂模式有什么意义?
严格模式:使用此类型的网页,浏览器解析将相对严格,不允许使用任何表现样式的标识和属性,比如在元素中直接使用background-color背景色属性。
混杂模式:浏览器对XHTML的解析较为宽松。允许使用4.01中的标签,但必须符合XHTML的语法。
如何触发这两种模式?加入XMl声明可触发
11.简述一下src与href的区别
href是指向网络资源所在位置,建立和当前元素(锚点)或当前文档()之间的
(用于超)
src 是指向外部资源所在位置,指向的容将会嵌入到文档中当前标签所在位置(在请求src资源时会将其指向的资源下载并应用到文档,例如js脚本, img图片和frame等元素)
(当浏览器解析到该元素时,会暂停其他资源的下载和处理,直到将该资源加载、编译、执行完毕) (这就是为什么将js脚本放在底部而不是头部)
12、简述同步和异步的区别
同步是阻塞模式: 指一个进程在执行某个请求的时候,若该请求需要一段时间才能返回信息,那么这个进程将会一直等待下去,直到收到返回信息才继续执行下去;
异步是非阻塞模式: 指进程不需要一直等下去,而是继续执行下面的操作,不管其他进程的状态。当有消息返回时系统会通知进程进行处理,这样可以提高执行的效率。
13、什么叫渐进增强和优雅降级?
渐进增强progressive enhancement:
针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
优雅降级graceful degradation:
一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。
区别:
a. 优雅降级是从复杂的现状开始,并试图减少用户体验的供给
b. 渐进增强则是从一个非常基础的,能够起作用的版本开始,并不断扩充,以适应未来环境的需要
c. 降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同时保证其根基处于安全地带
14.浏览器渲染原理
(1)首先获取html , HTML被解析成DOM Tree,CSS被解析成CSS Rule Tree
(2)把DOM Tree和CSS Rule Tree经过整合生成Render Tree(布局阶段)
(3)元素按照算出来的规则,把元素放到它该出现的位置,通过显卡画到屏幕上
15.对WEB标准以及W3C的理解与认识
标签闭合、标签小写、不乱嵌套、使用外链css和js脚本
结构行为表现分离、加快文件下载与页面速度
更少的代码和组件,容易维护、改版方便,提高易用性
16.Restful API是什么
Restful的意思就是(资源)表现层状态转化。
"资源": 就是网络上的一个实体,或者说网络上的一个具体信息。它可以是一段文本、一图片、一首歌曲、一种服务,总之就是一个具体的实在,每一个URI代表一种资源(Resources)。
"表现层": 其实指的是"资源"的"表现层",把"资源"具体呈现出来的形式,叫做它的"表现层"(Representation)。
如果客户端想要操作服务器,必须通过某种手段,让服务器端发生"状态转化"(State Transfer)。而这种转化是建立在表现层之上的,所以就是"表现层状态转化"。
Restful就是客户端和服务器之间,传递这种资源的某种表现层
客户端通过四个HTTP动词,对服务器端资源进行操作,实现"表现层状态转化"
Restful API就是符合Restful架构的API设计。
Restful API一些具体实践:
应该尽量将API部署在专用域名之下。
不应该在URL中包含动词或将API的版本号放入URL
17. B. C. D.
Web前端开发笔试题集锦(已读)
Web前端开发笔试题集锦 HTML/CSS篇 1, 判断字符串是否是这样组成的,第一个必须是字母,后面可以是字母、数字、下划线,总长度为5-20 var reg = /^[a-zA-Z][a-zA-Z_0-9]{4,19}$/; reg.test("a1a__a1a__a1a__a1a__"); 2,截取字符串abcdefg的efg var str = "abcdefg"; if (/efg/.test(str)) { var efg = str.substr(str.indexOf("efg"), 3); alert(efg); } 3,判断一个字符串中出现次数最多的字符,统计这个次数 //将字符串的字符保存在一个hash table中,key是字符,value是这个字符出现的次数 var str = "abcdefgaddda"; var obj = {}; for (var i = 0, l = str.length; i < l; i++) { var key = str[i]; if (!obj[key]) { obj[key] = 1; } else { obj[key]++; } } /*遍历这个hash table,获取value最大的key和value*/ var max = -1; var max_key = ""; var key; for (key in obj) { if (max < obj[key]) { max = obj[key]; max_key = key; } } alert("max:"+max+" max_key:"+max_key); 4,IE与FF脚本兼容性问题 (1) window.event: 表示当前的事件对象,IE有这个对象,FF没有,FF通过给事件处理函数传递事件对象 (2) 获取事件源
公司必备面试题库
面试题库 一、简单寒暄 1、您怎么过来的?交通还方便吧! 2、从(待定)到杭州要多长时间?路途辛苦吗? 3、以前来过郑州吗?对这里的印象如何,跟你所在的城市有何不同的感受? 4、这几天的(或这边的)天气较( 待定),您还能适应吧! 5、您来自来哪里?(简单与面试者聊聊他出身地的特点) 二、观或听: 1、衣着整齐度 2、精神面貌 3、行、坐、立动作 4、口头禅、礼貌用语等 三、口头表达能力(注意语言逻辑性、用语修辞度、口头禅、语言波幅等) 1、请您先用3-5分钟左右的时间介绍一下自己吧! 2、您先说说您最近服务的这家公司(由简历而定)的基本情况吧(规模、产品、市场)! 3、您在目前工作岗位中主要有哪些工作内容?主要的顾客有哪些? 4、请您简要介绍一下自己的求学经历。 5、请您简要介绍一下自己的成长历程。 四、灵活应变能力(也涉及工作态度) 1、您为何要离开目前服务的这家公司?(答案可能是待遇或成长空间或人际氛围或其它,待回答完毕后继续发问) -----您跟您的主管或直接上司有没有针对以上问题沟通过?(如果没有,问其原因;如果有,问其过程和结果) 2、除了简历上的工作经历,您还会去关注哪些领域(或有没有其它潜在的兴趣或是否想过去尝试、从事的其它职业)? -----(若有,继续发问)您觉得这跟您目前要从事的职业有哪些利、弊关系? -----(若无,继续发问)您不觉得您的知识结构有些狭窄或兴趣较贫乏,说说未来的改善计划? 3、您在选择工作中更看重的是什么?(可能是成长空间、培训机会、发挥平台、薪酬等答案) (若薪酬不排在第一,问)-------您可不可以说说你在薪酬方面的心理预期?(待回答完毕后)那您刚才的意思也可以这样理解:薪酬方面可以适当低于您的心理预期,对吗?(若薪酬显得不太让步,可问) 有人说挣未来比挣钱更为重要,您怎样理解?(若薪酬排在第一,问)--------有人说挣未来比挣钱更为重要,您怎样理解? 4、您觉得您在以前类似于我司提供的这个岗位上的工作经历中有哪些方面做得不足? (若答有,问)------您打算在以后的工作中采取哪些改善措施?(待回答完毕后,继续发问)您再想想如果到我们公司来任职还有没有补充改善措施?
前端面试题大全(html篇)
HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言。最主要的不同: (1)XHTML元素必须被正确地嵌套 (2)XHTML元素必须被关闭 (3)XHTML标签名必须用小写字母 (4)XHTML文档必须拥有根元素 2.什么是语义化的HTML html5的语义化是指用正确的标签包含正确的容,比如nav标签就应该包含导航条容 (1)直观的认识标签对于搜索引擎的抓取有好处,用正确的标签做正确的事情! (2)html语义化就是让页面的容结构化,便于对浏览器、搜索引擎解析 (3)在没有CCS样式情况下也以一种文档格式显示,并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下和各个关键字的权重,利于SEO。 (4)使阅读源代码的人更容易将分块,便于阅读维护理解。 写一段语义的html代码(HTML5中新增加的很多标签如:
、 前端开发的面试题
前端开发的面试题 web前端面试题 以下是收集一些面试中经常会遇到的经典面试题以及自己面试过程中无法解决的问题,通过对知识的整理以及经验的总结,重新巩固自身的前端基础知识。 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.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素:div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容,border ,margin,padding 5.CSS引入的方式有哪些? link和@import的区别是?
内联内嵌外链导入 区别:同时加载 前者无兼容性,后者CSS2.1以下浏览器不支持 Link 支持使用script改变样式,后者不可 6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高? 标签选择符类选择符 id选择符 继承不如指定 Id>class>标签选择 后者优先级高 7.前端页面有哪三层构成,分别是什么?作用是什么? 结构层 Html 表示层 CSS 行为层 js 8.css的基本语句构成是? 选择器{属性1:值1;属性2:值2;……} 9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? Ie(Ie内核) 火狐(Gecko) 谷歌(webkit) opear(Presto) 10.写出几种IE6 BUG的解决方法 1.双边距BUG float引起的使用display 2.3像素问题使用float引起的使用dislpay:inline -3px 3.超链接hover 点击后失效使用正确的书写顺序 link visited hover active 4.Ie z-index问题给父级添加position:relative 5.Png 透明使用js代码改 6.Min-height 最小高度 !Important 解决’ 7.select 在ie6下遮盖使用iframe嵌套
web前端开发面试题汇总模板
web前端开发面试题汇总 1天前653浏览2评论 前端面试题汇总 HTML&CSS 1. 常用那几种浏览器测试?有哪些内核(Layout Engine)? (Q1) 浏览器:IE,Chrome,FireFox,Safari,Opera。 (Q2) 内核:Trident,Gecko,Presto,Webkit。 2. 说下行内元素和块级元素的区别?行内块元素的兼容性使用? (IE8 以下) 行内元素:会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效。 块级元素:各占据一行,垂直方向排列。从新行开始结束接着一个断行。 兼容性:display:inline-block;display:inline;zoom:1; 3. 清除浮动有哪些方式?比较好的方式是哪一种? (1)父级div定义height。 (2)结尾处加空div标签clear:both。 (3)父级div定义伪类:after和zoom。 (4)父级div定义overflow:hidden。 (5)父级div定义overflow:auto。 (6)父级div也浮动,需要定义宽度。 (7)父级div定义display:table。
(8)结尾处加br标签clear:both。 总结:比较好的是第3种方式,简洁方便。 4. box-sizing常用的属性有哪些?分别有什么作用? 常用的属性:box-sizing: content-box border-box inherit; 作用:content-box:宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框(元素默认效果)。 border-box:元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。 5. Doctype作用?标准模式与兼容模式各有什么区别? (Q1) 告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。 (Q2) 标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。 6. HTML5 为什么只需要写< Doctype html>? HTML5不基于SGML,因此不需要对DTD进行引用;但是需要doctype来规范浏览器的行为(让浏览器按照它们应该的方式来运行)。而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所使用的文档类型。 7. 页面导入样式时,使用link和@import有什么区别? (1)link属于XHTML标签,除了加载CSS外,还能用于定义RSS, 定义rel连接属性等作用;而@import是CSS提供的,只能用于加载CSS; (2)页面被加载的时,link会同时被加载,而@import引用的CSS会等到页面
广告公司面试试题及答案word版本
广告公司面试试题及 答案
设计人员试题 一、个人素质方面的问题 1、你是如何理解设计工作的? 答:设计玩我,我玩设计,大家一起玩完 2、设计与绘画艺术有什么最本质的区别? 答:以自我为中心与以商业为中心的区别。 3、为什么常有人说“纯艺术做的好的人大多不能同样在商业美术有很高的成就”呢? 答:太过自我的人在商业社会有所成就不易,难被接受。 4、商业设计的服务对象是什么? 答:市场 5、商业设计的设计水平是学校里学习来的吗?为什么? 答:不是,学校只是个骗取学费的地方,要靠自己才能学的来 6、你在学校学习的时候学过什么样的相关课程? 答:没什么就随便了解哈。 7、设计有没有最好的概念? 答:没有最好,只有最适合。 8、设计作品好坏的标准在哪里? 答:较高的审美下的创造性,服务于商业。 9、平面设计工作是如何进行?有哪些一般可行的过程? 答:每人的工作方式不同,但是有经验的人会有好的方法,视情形看。 10、目前国内外最时尚的平面设计理念是什么? 答:现在流行简约风(这也是为什么常听人说美指做的很简洁之类) 11、在你所见的平面设计作品中你认为哪些国家或地区的作品令你印象深一些?为什么? 答:视自已的情况而定,主要是要讲出你认为深的理由,由此看出一个人的欣赏水平层次。 12、国内你最欣赏的平面设计师有哪些? 答:视自己的情况而定,但最好能有大家都熟悉的作品。 13、国内的平面设计作品对你印象最深的是哪些? 答:视自己的情况而定,但最好是都熟悉的作品。 14、你认为最成功的平面设计作品是什么,举一二例子说明一下? 答:同上。 15、国外的发达国家的平面设计状况是怎样的? 答:谈你对于世界设计状况的认识,主要看你有没有为自己准备理论知识,有没有关注设计。 16、中国的平面设计与国外的同行比较有什么样的优势与不足? 答:优势在于起步虽晚但机会多,不足在于观念与创新能力。 17、国内做平面设计最发达的地区有哪些?这什么? 答:深圳、上海、广州、北京等地,与经济发展密切相关。 18、国内做平面设计工作的一般是有什么教育背景的人员? 答:大部分为接受过绘画、设计教育的人员,少数例外。 19、国内发达地区平面设计的一般收入状况是怎样的呢? 答:谈自已以往公司的做设计一行的收入状况即可,考查该同志有没有在这些地区工作过。 20、你曾经服务的企业你认为最得意的作品是什么? 答:谈谈你得意的地方,如果没有即可知没有做过啥事。 21、你与他人合作完成的作品中最成功的案例是什么?
前端最新面试题
这篇文章将分为三部分css和html为一部分,js、jQuery为一部分,vue与性能优化为一部分,今天会先整理css与html 1,弹性盒布局 父级设置display:flex将对象作为弹性伸缩盒显示 采用Flex布局的元素,被称为Flex容器(flex container),简称“容器”。其所有子元素自动成为容器成员,成为Flex项目(Flex item),简称“项目”。 容器默认生成两根主轴,水平方向主轴(main axis)和垂直方向交叉轴(cross axis),默认项目按主轴排列。 设置在容器上的属性有6种 分别为 flex-direction:决定主轴的方向(即项目的排列方向) flex-wrap:定义换行情况 flex-flow:flex-direction和flex-wrap的简写,默认row nowrap justify-content:定义项目在主轴上的对齐方式。 align-item:定义在交叉轴上的对齐方式 align-content:定义多根轴线的对齐方式 详细属性值请参阅文档 2,html5新标签与新功能 新标签: header,footer,article,aside,nav,section,time,progress, ruby,mark.... 新功能: vidio,audio,canvas,拖放,离线应用,web存储(sessionStorage,localStorage,sessionStorage 方法针对一个session 进行数据存储。当用户关闭浏览器窗口后,数据会被删除,localStorage 对象存储的数据没有时间限制。第二天、第二周或下一年之后,数据依然可用),历史状态管理,地理位置,新增input类型(color、date、datetime、datetime-local、email、month、number、range、search、tel、time、url、week),新增表单元素,WebSocket 3、css3的新特性 属性选择器:[attribute],[attribute=value],[attribute~=value]... 伪类选择器::first-letter ,:first-line,:first-child.... 伪元素选择器::before,:after border:border-image,border-radius,box-shadow 背景:background-size,background-origin,background-clip,background-image 渐变:线性渐变(Linear Gradients)径向渐变(Radial Gradients)
JavaScript精选面试题
一选择题(单选) 1、以下哪条语句会产生运行错误:() A.var obj = (); B.var obj = []; C.var obj = {}; D.var obj = //; 答案:A 2、以下哪个单词不属于javascript保留字:() A.with B.parent C.class D.void 答案:B 3、请选择结果为真的表达式:() A.null instanceof Object B.null === undefined C.null == undefined D.NaN == NaN 答案:C 二、不定项选择题 4、请选择对javascript理解有误的:() A.JScript 是javascript的简称 B.javascript是网景公司开发的一种Java脚本语言,其目的是为了简化Java的开发难度 C.FireFox 和IE存在大量兼容性问题的主要原因在于他们对javascript 的支持不同上 D.AJAX技术一定要使用javascript技术 答案:ABCD 5、foo对象有att属性,那么获取att属性的值,以下哪些做法是可以的:() A.foo.att B.foo(“att”) C.foo[“att”] D.foo{“att”} E.foo[“a”+”t”+”t”] 答案:ACE
6、在不指定特殊属性的情况下,哪几种HTML标签可以手动输入文本:() A. B. C. D.
答案:AB 7、以下哪些是javascript的全局函数:() A.escape B.parseFloat C.eval D.setTimeout E.alert 答案:ABC 8、关于IFrame表述正确的有:() A.通过IFrame,网页可以嵌入其他网页内容,并可以动态更改 B.在相同域名下,内嵌的IFrame可以获取外层网页的对象 C.在相同域名下,外层网页脚本可以获取IFrame网页内的对象 D.可以通过脚本调整IFrame 的大小 答案:ABCD 9、关于表格表述正确的有:() A.表格中可以包含TBODY元素 B.表格中可以包含CAPTION元素 C.表格中可以包含多个TBODY元素 D.表格中可以包含COLGROUP元素 E.表格中可以包含COL元素 答案:ABCDE 10、关于IE的window对象表述正确的有:() A.window.opener属性本身就是指向window对象 B.window.reload() 方法可以用来刷新当前页面 C.window.location=”a.html”和window.location.href=”a.html”的作用都是把当前页面替换成a.html页面 D.定义了全局变量g;可以用window.g的方式来存取该变量 答案:ACD 三、问答题Web前端开发工程师面试题
一、CSS (1) 二、HTML (3) 三、jquery (3) 四、综合 (4) 一、C SS 1.CSS样式表根据所在网页的位置,可分为?(B ) A.行内样式表、内嵌样式表、混合样式表 B.行内样式表、内嵌样式表、外部样式表 C.外部样式表、内嵌样式表、导入样式表 D.外部样式表、混合样式表、导入样式表 2.对于标签,其中*代表(C ) A. 注释的时候才用上 B. 没有这个标签 C. 通配符,意思是所有的标签 3.在CSS中下面哪种方法表示超链接文字在鼠标经过时,超链接文字无下划线?(B ) A. A:link{TEXT-DECORATION: underline } B. A:hover {TEXT-DECORATION: none} C. A:active {TEXT-DECORATION: blink } D. A:visited {TEXT-DECORATION: overline } 4.下面代码片段,说法正确的是:(B ) .DIV1 { position:absolute; line-height:22px; height:58px; background-color: #FF0000; } A. Line-height:22px;修饰文本字体大小 B. position:absolute;表示绝对定位,被定位的元素位置固定 C. height:58px; 表示被修饰的元素距离别的元素的距离 D. background-color: #FF0000; 表示被修饰的元素的背景图像 5.用CSS设置DIV的左边为红色实线,下面设置正确的是(C ) A.style=”border-top: #ff0000 1 solid;”
前端基础面试题汇总
1.行内元素和块级元素有哪些?有什么区别? 块级:
行内:a、br、i、img、input、strong 区别:块级元素的W、H、margin和padding都可以控制 行内元素的W、H,以及margin和padding的top和bottom不能控制 2.介绍所知道的CSS hack技巧 由于不同的浏览器对CSS的支持和解析结果不同,所以可以使用CSS hack来对不同的浏览器写不同的CSS样式,常见的有(_,*,!important) 3.CSS定位方式有哪些?position的属性值之间的区别是什么 static(静态) 没有特别的设定,遵循基本的定位规定,不能通过z-index进行层次分级。 relative(相对定位) 对象不可层叠、不脱离文档流,参考自身静态位置通过top,bottom,left,right 定位,并且可以通过z-index进行层次分级。 absolute(绝对定位) 脱离文档流,通过top,bottom,left,right定位。选取其最近一个最有定位设置的父级对象进行绝对定位,如果对象的父级没有设置定位属性,absolute元素将以body坐标原点进行定位,可以通过z-index进行层次分级。 fixed(固定定位)这里所固定的参照对像是可视窗口而并非是body或是父级元素。可通过z-index 进行层次分级。 4.类的定义方法(prototype)(继承) var Obj3 = new Function(); Obj3.prototype = { v1 : "", get_v1 : function() { return this.v1; }, set_v1 : function(v) { this.v1 = v; } }; 5.DOM 操作 1.向当前对象追加节点 var para=document.createElement("p"); var node=document.createTextNode("这是新段落。"); para.appendChild(node); 2.移除当前节点的子节点,并返回节点 var childnode=document.getElementById("child"); var removednode=document.getElementById("father").removeChild(childnode) 3.复制并返回当前节点(复制节点本身,不复制子节点) varul = document.getElementByIdx_xx_x("myList"); //获得ul vardeepList = ul.cloneNode(true); //深复制 varshallowList = ul.cloneNode(false); //浅复制
js基础部分面试题
JS基础面试题 1.介绍下js中关于arguments 。【考点:函数arguments】 在函数代码中,使用特殊对象 arguments,开发者无需明确指出参数名,就能访问它们。例如,在函数 sayHi() 中,第一个参数是 message。用 arguments[0] 也可以访问这个值,即第一个参数的值(第一个参数位于位置 0,第二个参数位于位置 1,依此类推)。 因此,无需明确命名参数,就可以重写函数: function sayHi() { if (arguments[0] == "bye") { return; } alert(arguments[0]); } 2.看以下JavaScript程序问:执行以上程序后,num的值为( D )【考点:数据类型】 var num; num=5+true; A、true B、false C、5 D、6 3、看以下JavaScript程序【考点:switch语句,break】 var x=prompt(“请输入1-5的数字!”,“”); switch (x) { case “1”:alert(“one”); case “2”:alert(“two”); case “3”:alert(“three”); case “4”:alert(“four”); case “5”:alert(“five”); default:alert(“none”); } 运行以上程序,在提示对话框中输入“4”,依次弹出的对话框将输出: ( B ) A、four,none B、four,five,none C、five D、five,none 4、分析下面的JavaScript代码段【考点:for循环】 a=new Array(2,3,4,5,6); sum=0; 输出结果是().(选择一项)
web前端研发工程师笔试题选择题带答案
1. 要动态改变层中内容可以使用的方法有( AB ) a) i nn erHTML b) i nn erText c) 通过设置层的隐藏和显示来实现 d) 通过设置层的样式属性的 display 属性 2. 当按键盘 A 时,使用onKeyDown 事件打印event.keyCode 的结果是(A ) a) 65 b) 13 c) 97 d) 37 3.在javascript 里,下列选项中不属于数组方法的是( B ); a) sort() b) l e ngth() c)con cat() d) r everse( ) 4.下列哪一个选项可以用来检索被选定的选项的索引号 ?(B) a)disabled b) selectedl ndex c) opti on d) multiple 5.希望图片具有”提交”按钮同样的功能,该如何编写表单提交?(A ) 6. 使div 层和文本框处在冋一行的代码正确的是 (D ); a) b) c) d) 7. 下列选项中,描述正确的是(选择两项)。(AD ) a)options.add(new Option(,a?,'A?))可以动态添加一个下拉列表选项 b)option.add(new Option(,a?,'A?))可以动态添加一个下拉列表选项 c) n ew Optio n(,a?,'A?)中?a 表示列表选项的值,?A 用于在页面中显示 d) n ew Option(,a?,'A?)中?A 表示列表选项的值,?a 用于在页面中显示 8. 、 var emp = new Array(3); for(var i in emp) 以下答案中能与for 循环代码互换的是:(选择一项)。(D ) A for(var i =0; i
项目管理公司面试题目
项目管理公司面试题目 1.自我介绍。 2.如何管理协调设计院,具体都有哪些工作。 答:一、设计院按照甲方的意思设计图纸,在施工中,施工方发现图纸有问题要先联系甲方,甲方找设计院会同监理和施工单位解 决。 二、如果是建设单位要管理设计单位的话,我认为先从控制设计开始防止设计院随意设计造成成本的增加 1控制平米砼中钢筋含钢量,2控制平米砼量,3建筑设计在满足建设单位要求的情况下,尽量选用 当地的通用做法, 3.如何协调现场参建各方的关系 答:一、首先,在工作中必须不断地提高自己的业务能力和协调 沟通能力,处理问题要坚持原则、常常深入施工第一线了解工程的实际状况并能及时解决各分包方的实际困难,尊重分包方的劳动成果, 人与人要互相尊重等。 然后,以参建各方签订的合同为依据。 二、1、要尊重监理、尊重施工单位,这样才会相互尊重,监理 单位、施工单位也更会尊重你! 2、要学习专业知识,不但要清楚,而且要综合,这样才能合理 调节各施工单位之间、施工单位与监理间的关系!
3、在严格控制工期、造价的条件上,尊重监理的意见,这样监 理在工作中才有积极性;对监理的一般错误,要进行私下交流,让他 更加努力。 4、对公司下达的指标、任务,可能对监理、施工单位有一定难度的, 你要说明实情,让他们体谅你,站在同一船上的人,一定会高兴的圆 满完成任务。 4.施工场地总平面布置图的主要内容是什么 答:(1)全部地上、地下建筑物、构筑物;(2)各种施工机械设备的布置;(3)周围道路和建筑及场内道路布置;(4)生产性、生活性临时设施;(5)临时供水(含消防)、供电线路及水源、电源; 5.砼中出现蜂窝、孔洞的处理方法有哪些 ? 答:(1)对数量不多的小蜂窝、露筋的砼表面,可用1:2水泥砂浆抹面修正。(2)蜂窝、孔洞的面积大不、深度较大时,可用高 压注入水泥浆泥法。(3)蜂窝、孔洞比较大,比较深,但未贯穿,可局部凿开砼,包漏斗形模板,用高一级砼或掺UEA微膨胀剂浇捣密实,达到强度凿除多余部分。(4)蜂窝、孔洞多而且严重,应 凿除整根构件,重新支模清理后浇捣砼,并处理好邻接面。 ?? 6.你做的上一个项目专业都存在什么问题,你是如何协调解决的。
最新web前端面试题(及答案)
1、常用那几种浏览器测试?有哪些内核(Layout Engine)? 答: (Q1) 浏览器:IE,Chrome,FireFox,Safari,Opera。 (Q2) 内核:Trident,Gecko,Presto,Webkit。 2、说下行内元素和块级元素的区别?行内块元素的兼容性使用?(IE8 以下)答: (Q1) 行内元素:会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-height),margin上下无效,padding上下无效。 块级元素:各占据一行,垂直方向排列。从新行开始结束接着一个断行。 (Q2) 兼容性:display:inline-block;*display:inline;*zoom:1; 3、清除浮动有哪些方式?比较好的方式是哪一种? 答: (Q1) (1)父级div定义height。 (2)结尾处加空div标签clear:both。 (3)父级div定义伪类:after和zoom。 (4)父级div定义overflow:hidden。 (5)父级div定义overflow:auto。 (6)父级div也浮动,需要定义宽度。 (7)父级div定义display:table。 (8)结尾处加br标签clear:both。 (Q2) 比较好的是第3种方式,好多网站都这么用。 4、box-sizing常用的属性有哪些?分别有什么作用? 答: (Q1)box-sizing: content-box|border-box|inherit; (Q2)content-box:宽度和高度分别应用到元素的内容框。在宽度和高度 之外绘制元素的内边距和边框(元素默认效果)。 border-box:元素指定的任何内边距和边框都将在已设定的宽度和高度内 进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的 宽度和高度。 5、Doctype作用?标准模式与兼容模式各有什么区别? 答: (Q1) 告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不 存在或格式不正确会导致文档以兼容模式呈现。 (Q2) 标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防 止站点无法工作。 6、HTML5 为什么只需要写?
Javascript笔试题及答案
J a v a s c r i p t笔试题及 答案 Company Document number:WTUT-WT88Y-W8BBGB-BWYTT-19998
Javascript面试笔试题 考试时间90分钟 一、不定项选择题(每题3分,共30分) 1.声明一个对象,给它加上name属性和show方法显示其name值,以下 代码中正确的是( D ) A.var obj = [name:"zhangsan",show:function(){alert(name);}]; B.var obj = {name:"zhangsan",show:”alert”}; C.var obj = {name:"zhangsan",show:function(){alert(name);}}; D.v ar obj = {name:"zhangsan",show:function(){alert;}}; 2.以下关于Array数组对象的说法不正确的是( CD) A.对数组里数据的排序可以用sort函数,如果排序效果非预期,可以给 sort函数加一个排序函数的参数 B.reverse用于对数组数据的倒序排列 C.向数组的最后位置加一个新元素,可以用pop方法 D.unshift方法用于向数组删除第一个元素 3.要将页面的状态栏中显示“已经选中该文本框”,下列JavaScript语句正确的 是( A ) A.="已经选中该文本框" B.="已经选中该文本框" C.="已经选中该文本框" D.="已经选中该文本框" 4.点击页面的按钮,使之打开一个新窗口,加载一个网页,以下JavaScript 代码中可行的是( AD)
WEB前端开发面试题集锦
1、列举你工作中遇到的IE6 BUG,谈谈解决方案。 3、如何用CSS分别单独定义IE6、7、8的width属性。 所有浏览器通用 height: 100px; IE6 专用 _height: 100px; IE6 专用 *height: 100px; IE7 专用 *+height: 100px; IE7、FF 共用 height: 100px !important; 4、CSS中哪些属性可以同父元素继承。 继承:(X)HTML元素可以从其父元素那里继承部分CSS属性,即使当前元素并没有定义该属性 Color;font-size; 5、你如何理解HTML结构的语意化。 1.去掉或样式丢失的时候能让页面呈现清晰的结构: html本身是没有表现的,我们看到例如
是粗体,字体大小2em,加粗;是加粗的,不要认为这是html 这些其实html默认的css样式在起作用,所以去掉或样式丢失的时候能让页面呈现清晰的结构不是语义化的HTML 点,但是浏览器都有有默认样式,默认样式的目的也是为了更好的表达html的语义,可以说浏览器的默认样式和HTML结构是不可分割的。 2.屏幕阅读器(如果访客有视障)会完全根据你的标记来“读”你的网页. 例如,如果你使用的含语义的标记,屏幕阅读器就会“逐个拼出”你的单词,而不是试着去对它完整发音. 3.PDA、手机等设备可能无法像普通电脑的浏览器一样来渲染网页(通常是因为这些设备对CSS的支持较弱). 使用语义标记可以确保这些设备以一种有意义的方式来渲染网页.理想情况下,观看设备的任务是符合设备本身的条染网页. 语义标记为设备提供了所需的相关信息,就省去了你自己去考虑所有可能的显示情况(包括现有的或者将来新的设备一部手机可以选择使一段标记了标题的文字以粗体显示.而掌上电脑可能会以比较大的字体来显示.无论哪种方式一文本标记为标题,您就可以确信读取设备将根据其自身的条件来合适地显示页面. 4.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重. 过去你可能还没有考虑搜索引擎的爬虫也是网站的“访客”,但现在它们他们实际上是极其宝贵的用户.没有他们的
宝洁公司面试题_宝洁八大问
宝洁公司面试题 目录 宝洁公司面试题 (1) 宝洁八大问 (2) 一般性问题 (3) 让人尴尬的问题 (3) 敏感的薪资问题 (4)
宝洁八大问 1、给出一个很高难的例子,来说明你采取何种手段来完成这一目标。 2、概述一种情况:你鼓动别人为了某一个目标而努力,而且你在其中扮演了领导角色来完成你的目标。 3、描述一种情形:你有了找寻外面的有关数据,定义关键点,决定行动步骤。 4、描述一个你有效利用事实并且试图说服其他人的事例。 5、举出一个事例,来说明你如何有效地同别人合作来完成一个重要目标。 6、描述一个你提出的创新性的建议或者计划,对一个活动的成功做出了重要贡献。 7、提供有一个事例来说明你详细估定了某一情形并且决定出行动的优先顺序。 8、提供一个例子说明你如何获得了技术上的细节而且将他们转换成实际的应用。 参考答案: 1、高难目标:设计一场音乐或者戏剧演出来庆祝普林斯顿大学百年庆典。 完成这一个目标的人:普林斯顿大学学会主席。我从中观察了解到:一位真实的领袖不是必需成为某一领域的专家,但是他一定拥有非凡魅力的和能力使不同兴趣、不同意见的甚至竞争的人共同来完成某一目标。 2、我发起的活动:组织一个团体在平安夜唱一首圣歌,代表我们的英文协会拜访大学的所有宿舍并且送圣诞礼物。我们的目标:拓宽学生对西方文化的了解。 我所扮演的领导角色:结合代表提议和我的主意并且决定:*唱什么歌? *那些人参加唱诗班? *我们在那个地点进行我们的表演? 结果:许多学生说我们送给他们的礼物带给了他们温暖并且希望我们在下个平安夜会举行类似的活动。 3、背景:我组织了管理学校英文协会建立后第一个活动。待完成的目标:帮一年级新学生和二年级学生提高他们的英语水平并且宣传我们的团体。 关键事项: *学生英语哪方面的英语能力需要精炼?有关的数据: *什么类型的娱乐在学生之中很流行并且提供了机会让他 们最有效地学习英语? *哪种类型的外国老师最适合这个位置? *我们的成员何时有空闲时间? *什么地方队大多数成员是方便的? *其他的相关因素,例如可用的地点以及设备。 4、背景:我提出一项计划,和附近的兄弟大学的协会合作来举行英语角活动。 不利因素: *我们学校的领导可能持有异议。 *费用昂贵,而且我们没有足够的人来实施这一个计划。*有太多的英语角,可能没有必要。 我利用一下有利因素: *我们的院长核准了这一份提议。 *我们的合伙伙伴能提供资金上的援助,而且我们的成员志愿实施计划并且努力完善细节之处。 *民意调查现在英语角不符合学生的需求而且缺乏独特性。结果:其他人被我们说服,而且我们成功建立起这个英语角。 5、背景:在军事训练中,我们举行军歌比赛。 设计:我和同学设计整个比赛节奏、安排、伴奏、高潮。排练:我连同那些掌管照明、声音和现场的人一起工作来产生最完美的艺术效果。 在舞台上:我担任指挥,并且用手势和眼神表达提醒同学们,我们配合默契。 结果:我们的连队嬴得这一比赛的第二名。 6、活动:举行企业家远见竞赛。 我的创新注意:召开公司的一个董事会会议,我们的候选人辩论了有关依照他们收集的市场数据销售现代健身仪器的可行性。 结果:竞赛是依据我的提议而进行的。 7、背景:在我们的晋级月最初开始的时的一个早晨,我发现在一些百货公司中的存货储备不够充足。 我队情形的估定:那四家商店彼此不是很远,而且他们的营业时间不相同,从一家店调运货物到另一家店具有可行性。 优先顺序:使拥有最大量客户的商店满足库存需要。 8、背景:在客户对啤酒口味的意见调查表中,我发现表格有些过时,限制了客户的悬着。 技术上能力:科学安排了调查表的形式。 结果:藉由转换调查表的形式,我们的公司获得了更多数量的更有效的数据。
相关文档