html+css+js面试题
- 格式:doc
- 大小:147.00 KB
- 文档页数:20
高级前端面试问题及答案解析前言:前端开发是当前互联网行业中的一项热门技术,其重要性不言而喻。
面试是升职加薪、求职换工作的必经之路。
为了帮助广大前端开发人员更好地备战面试,本文将结合自身经验和行业标准,整理了一些高级前端面试常见的问题及答案解析。
一、HTML/CSS1. 请解释一下HTML语义化的概念,以及为什么它对SEO有重要意义。
HTML语义化是指合理正确地使用HTML标签来描述页面结构及内容信息。
通过正确使用语义化标签,可以帮助浏览器和搜索引擎更好地理解页面结构,提升页面的可访问性和可读性,从而对SEO有重要意义。
例如,使用<p>标签表示段落,使得搜索引擎可以更好地理解其中的文本内容。
2. 请解释一下CSS盒模型的概念,并说明标准盒模型和IE盒模型的区别。
CSS盒模型是指一个网页元素在页面中所占空间的计算模型。
标准盒模型包含了元素的内容区域、内边距、边框和外边距;而IE盒模型则将内边距和边框都计算在了元素的宽度和高度之内。
这导致了标准盒模型和IE盒模型在计算宽度和高度时的差异。
例如,标准盒模型下,一个元素的宽度和高度等于内容区域的宽度和高度;而IE盒模型下,一个元素的宽度和高度等于内容区域、内边距和边框的宽度和高度之和。
3. 请解释一下CSS选择器优先级的计算规则,并给出一个例子。
CSS选择器优先级是用于确定当多个选择器作用在同一个元素上时,哪个选择器的样式会被应用的规则。
优先级的计算规则为:标签选择器的权重为1,类选择器的权重为10,ID选择器的权重为100,行内样式的权重为1000,以及通过!important声明的样式的权重最大。
例如,对于以下的样式规则:```p {color: green;}p#myId {color: red;}```其中,权重计算为:ID选择器权重100 + 标签选择器权重1 = 101。
因此,带有ID为"myId"的段落元素的文字颜色将会是红色。
前端面试题八股文总结前端面试八股文是指在面试过程中经常被问到的问题,大多都有固定化、格式化的答案。
可以认为是“送分题”,前提是花时间背下来。
下面总结了一些经典的面试八股文。
HTML + CSS1.讲一下盒模型,普通盒模型和怪异盒模型有什么区别?2.块元素和行内元素区别是什么?常见块元素和行内元素有哪些?3.HTML语义化标签有哪些?4.伪类和伪元素的区别是什么?5.CSS如何实现垂直居中?6.CSS常见的选择器有哪些?7.CSS的优先级如何计算?8.长度单位px、em和rem的区别是什么?9.讲一下flex弹性盒布局?10.浮动塌陷问题解决方法是什么?11.position属性的值有哪些?各个值是什么含义?12.BFC、IFC是什么?JavaScript1.谈谈对原型链的理解。
2.js如何实现继承?3.js有哪些数据类型?4.js有哪些判断类型的方法?5.如何判断一个变量是否数组?6.Null 和 undefined 的区别?、7.call bind apply的区别?8.防抖节流的概念?实现防抖和节流。
9.深拷贝、浅拷贝的区别?如何实现深拷贝和浅拷贝?10.对比一下var、const、let。
11.ES next新特性有哪些?12.箭头函数和普通函数区别是什么?13.使用new创建对象的过程是什么样的?14.this指向系列问题。
15.手写bind方法。
16.谈谈对闭包的理解?什么是闭包?闭包有哪些应用场景?闭包有什么缺点?如何避免闭包?17.谈谈对js事件循环的理解?18.谈谈对promise理解?19.手写 Promise。
20.实现 Promise.all方法。
21.Typescript中type和interface的区别是什么?22.讲讲Typescript中的泛型?23.Typescript如何实现一个函数的重载?24.CmmonJS和ESM区别?25.柯里化是什么?有什么用?怎么实现?26.讲讲js垃圾回收机制。
htmlcssjs考试题及答案HTML/CSS/JS考试题及答案一、选择题(每题3分,共30分)1. HTML5中,哪个元素用于定义最重要的标题?A. `<h1>`B. `<h6>`C. `<p>`D. `<div>`答案:A2. CSS中,哪个属性用于设置文本的颜色?A. `color`B. `background-color`C. `font-size`D. `text-align`答案:A3. 在HTML中,`<form>`元素的哪个属性用于指定表单数据提交到服务器的URL?A. `action`B. `method`C. `type`D. `href`答案:A4. JavaScript中,哪个函数用于将字符串转换为小写?A. `toLowerCase()`B. `toUpperCase()`C. `trim()`D. `replace()`答案:A5. CSS中,哪个选择器用于选择类名为“header”的所有元素?A. `.header`B. `#header`C. `header`D. `[name="header"]`答案:A6. 在HTML中,哪个元素用于定义客户端脚本?A. `<script>`B. `<noscript>`C. `<embed>`D. `<object>`答案:A7. JavaScript中,哪个对象用于处理浏览器窗口?A. `window`B. `document`C. `navigator`D. `screen`答案:A8. CSS中,哪个属性用于设置元素的宽度?A. `width`B. `height`C. `max-width`D. `min-width`答案:A9. HTML5中,哪个元素用于定义一个节或文档的一部分?A. `<section>`B. `<article>`C. `<div>`D. `<header>`答案:A10. JavaScript中,哪个方法用于将字符串分割成数组?A. `split()`B. `join()`C. `slice()`D. `substring()`答案:A二、填空题(每题4分,共20分)1. HTML中的`<meta>`标签用于提供______信息。
最新前端开发面试题及答案1. 什么是前端开发?答案:前端开发是指使用HTML、CSS和JavaScript等技术构建网站或Web应用程序的用户界面的过程。
2. 解释一下什么是响应式网页设计?答案:响应式网页设计是一种使网站能够适应不同屏幕尺寸和设备的技术,确保用户在任何设备上都能获得良好的浏览体验。
3. 请简述HTML5的新特性。
答案:HTML5引入了新的语义标签,如`<header>`、`<footer>`、`<article>`等,增强了Web应用的功能,如`<canvas>`用于绘图,`<video>`和`<audio>`用于媒体播放,以及对本地存储的支持等。
4. CSS3相比CSS2有哪些改进?答案:CSS3在CSS2的基础上增加了多种新特性,如圆角(border-radius)、阴影(box-shadow)、渐变(gradients)、转换(transforms)和动画(animations)等。
5. JavaScript中的闭包是什么?答案:闭包是指有权访问另一个函数作用域中的变量的函数,即使在创建该函数的作用域之外,这些变量也会被保留在内存中。
6. 请解释同步和异步编程的区别。
答案:同步编程是指代码按照顺序执行,一个任务完成后才执行下一个任务。
异步编程允许程序在等待某个任务完成时继续执行其他任务,通常通过回调函数、Promise或async/await来实现。
7. 什么是跨域请求(CORS)?答案:跨域请求(CORS)是指浏览器在发起一个HTTP请求时,请求的域名与当前网页的域名不同,浏览器出于安全考虑,会限制这种跨域请求。
8. 请描述一下事件冒泡和事件捕获。
答案:事件冒泡是指当一个元素触发事件时,该事件会从事件源元素开始,逐级向上传播到文档的根元素。
事件捕获则是事件从根元素开始,向下传播到目标元素。
9. 什么是单页应用(SPA)?答案:单页应用(SPA)是一种Web应用或网站,它通过动态重写当前页面来与用户交互,避免了从服务器重新加载整个新页面的过程。
45道CSS 基础面试题(附答案)刘宁Leo1 介绍一下标准的CSS 的盒子模型?与低版本IE 的盒子模型有什么不同的?标准盒子模型:宽度=内容的宽度(content )+ border + padding + margin低版本IE 盒子模型:宽度=内容宽度(content+border+padding )+ margin2 boxsizing 属性?用来控制元素的盒子模型的解析模式,默认为contentboxcontextbox :W3C 的标准盒子模型,设置元素的 height/width 属性指的是content 部分的高/宽borderbox :IE 传统盒子模型。
设置元素的height/width 属性指的是border + padding + content 部分的高/宽3 CSS 选择器有哪些?哪些属性可以继承?CSS 选择符:id 选择器(#myid)、类选择器(.myclassname)、标签选择器(div, h1, p)、相邻选择器(h1 + p)、子选择器(ul > li )、后代选择器(li a )、通配符选择器(*)、属性选择器(a[rel="external"])、伪类选择器(a:hover, li:nthchild )可继承的属性:fontsize, fontfamily, color不可继承的样式:border, padding, margin, width, height优先级(就近原则):!important > [ id > class > tag ]!important 比内联优先级高4 CSS 优先级算法如何计算?元素选择符: 1class 选择符: 10id 选择符:100元素标签:10001. !important 声明的样式优先级最高,如果冲突再进行计算。
中级前端面试题
一、常规问题
1、请介绍一下自己的Web 前端开发技术栈?
2、目前有接触过哪些前端框架,有多少实际项目经验?
3、在开发中如何使用css和javascript?
4、你在用户界面设计方面有那些经验?
5、你能否描述一下前端自动化测试?
二、HTML/CSS 相关
1、你说说HTML和XHTML有什么区别?
2、CSS伪元素有哪些?
3、HTML5 新增的API有哪些?
4、CSS 布局及性能优化有哪些?
5、如何把一个浮动的div放在内容的下方?
三、JavaScript 相关
1、回答JavaScript的原型链概念?
2、JavaScript的内存管理机制是什么?
3、Ajax的核心原理是什么?
4、能否说说DOM操作的方法有哪些?
5、你对ES6的支持有什么看法?
四、性能优化
1、你在开发中有用到哪些性能优化工具?
2、如何利用缓存机制减少http网络请求量?
3、如何减少js文件大小和数量?
4、你有用过何种方法减少页面重绘和回流?
5、你如何优化web页面加载速度?
五、安全
1、你如何保护前端应用程序?
2、你怎么设计用户安全的登录流程?
3、你了解哪些常见的前端漏洞?
4、你如何保护用户数据以及网站网站不被恶意攻击?
5、你熟悉HTTP 加密协议吗?。
html+css+js测试题选择题1.html是什么意思?a)高级文本语言b)超文本标记语言c)扩展标记语言d)图形化标记语言2.哪一个标记用于使html文档中表格里的单元格占据多个单元格的宽度?a)cellspacingb)cellpaddingc)rowspand)colspan3.下列那项技术可以用于帮助网页设计时使页面具有统一、专业的外观?a)htmlb)dhtmlc)cssd)url4.以下哪个项目不是可以在h t m l文档中使用的特殊字符。
a)>小于号<b)&tl; <:大于号>c)©d) 5.a文件夹与b文件夹是同级文件夹,其中a下有a.htm,b下有b.htm文件,现在我们希望在a.htm文件中创建超链接,链接到b.htm,应该在a.htm页面代码中如何描述链接内容?a)b.htmb)././././b/b.htmc)../b/b.htmd)../../b.htm6.我们想要将表格中加入的图像充满整个单元格,使用哪种方式可以做到?a)size="100"b)size="100%"c)width="100"d)width="100%"7. 不是表单元素input的类型的是a)textb)radioc)selectd)filee)passwordf)radiog)textareah)hiddeni)checkboxj)option8 . 下列哪种css样式定义的方式拥有最高的优先级?a) 嵌入b) 行内c) 链接d) 导入9 . web标准的制定者是?a) 微软b) 万维网联盟(w3c)c) 网景公司(netscape)d) sun公司10 . 请选择产生粗体字的html标签:a) <i>b) <b>c) <em>d) <strong>11 . 下边能把超链接页面显示到框架中的是()?a) <a href="" target="_blank">baidu<a><iframe src="" />b) <a href="" target="myframe">baidu<a><iframe href="" name="myframe" />c) <a href="" target="myframe">baidu<a><iframe src="" name="myframe" />d) <a src="" target="myframe">baidu<a><iframe href="" name="myframe" />12 . 以下选项中,哪个全部都是表格标签?a) <table><head><tfoot>b) <table><tr><td>c) <table><tr><tt>d) <thead><body><tr>13 . 以下的html中,哪个是正确引用外部样式表的方法?a) <style src="mystyle.css">b) <link rel="stylesheet" type="text/css" href="mystyle.css">c) <stylesheet>mystyle.css</stylesheet>14. 如何为所有的<h1>元素添加背景颜色?a) h1.all {background-color:#ffffff}b) h1 {background-color:#ffffff}c) all.h1 {background-color:#ffffff}15 . css如何改变某个元素的文本颜色?a) text-color:b) color:c) font-color:16 . 以下的css中,可使所有<p>元素变为粗体的正确语法是?a) <p style="font-size:bold">b) <p style="text-size:bold">c) p {font-weight:bold}d) p {text-size:bold}17 . 如何显示没有下划线的超链接?a) a {text-decoration:none}b) a {text-decoration:no underline}c) a {underline:none}d) a {decoration:no underline}18 . 关于相对定位和绝对定位,下列说法正确的是()a) 相对定位的元素会脱离标准文档流b) 绝对定位的元素会脱离标准文档流c) 相对定位的位置属性值是相对于最近的父元素的位置d) 绝对定位的位置属性值是相对于最近的父元素的位置19 . 写“hello world”的正确javascript语法是?a) document.write("hello world")b) "hello world"c) response.write("hello world")d) ("hello world")20 . 插入javacript的正确位置是?a) <body>部分b) <head>部分c) <body>部分和<head>部分均可21 . 引用名为“xxx.js”的外部脚本的正确语法是?a) <script src="xxx.js">b) <script href="xxx.js">c) <script name="xxx.js">22 . 如何在显示提示框,提示hello world?a) confirm("hello world")b) prompt("hello world")c) alert("hello world")d) show("hello world")23 . 如何创建函数?a) function myfunction(var num){}b) function myfunction(){}c) void myfunction() {}d) fun = function () {} 匿名函数24. 定义javascript数组的正确方法是?a) var txt = new array="tim","kim","jim"b) var txt = new array(1:"tim",2:"kim",3:"jim")c) var txt = new array("tim","kim","jim")d) var txt = new array:1=("tim")2=("kim")3=("jim")25 . 打开名为“window2”的新窗口的javascript语法是?a) open.new("","window2")b) window.open("","window2")c) new("","window2")d) new.window("","window2")26.下列不属于文档对象的方法的是()a) getElementsByNameb) getElementByIdc) getElementByNamed) getElementsByTagName27.分析下面这两行代码的作用()01 <a href=”javascript:history.back()”></a>02 <a href=”javascript:history.forward()”></a>a)代码第1行的作用相当于后退按钮b)代码第2行的作用相当于后退按钮c)代码第1行的作用相当于前进按钮d)以上表述不都不正确28.通常情况下,一个url的格式是()a)协议//路径名称主机:端口/#哈希标识?搜索条件b)协议//主机:端口/#哈希标识/路径名称?搜索条件c)协议//主机:端口/路径名称?搜索条件d)协议//主机:端口?搜索条件/路径名称#哈希标识29. 对location对象的叙述错误的是()a) 可以获取当前路径b) 可以改变当前路径c) 可以用来刷新页面d) 是只读属性,不能修改30.对下面这段代码分析不正确的是()funtcion submit(){form1.submit();alert(“提交成功”)}function reset(){form1.reset();}a)调用submit()可以提交表单b)调用reset()重置表单c)只有点击提交按钮才能提交表单d)submit事件属于form表单31.下列对符号在正则表达式中所表示的意义解释错误的是()a) ˆ(尖号):匹配字符串的开头b) $(美元符号):匹配字符串的结尾c) ?(问号):匹配前面的子表达式一次或多次d) \(反斜杠):对特殊字符的特殊元字符含义进行转义32、产生当前日期的方法是( )a.now();b.date()c.new Date()d.new Now()33、如果想在网页显示后,动态地改变网页的标题( )a.是不可能的b.通过document.write(“新的标题内容”)c. 通过document.title=(“新的标题内容”)d. 通过document.changetitle(“新的标题内容”)34、在html页面中,css样式的属性名为background-image,对应的js中style对象的属性名是()。
HTML(5)+CSS(3)+JS+flex1. 以下那个属性用来设置盒子的动画() [单选题] *A、TransformB、TransitionC、Animation(正确答案)D、Form2. 以下那个表示的位移变形() [单选题] *A、translate(正确答案)B、rotateC、scaleD、skew3. 以下那个属性用来设置盒子的过渡() [单选题] *A、TransformB、Transition(正确答案)C、AnimationD、Form4. 以下那个表示的缩放变形() [单选题] *A、translateB、rotateC、scale(正确答案)D、skew5. 以下那个属性用来设置盒子阴影的() [单选题] *A、shadow-boxB、border-radiusC、box-shadow(正确答案)D、resize6. 以下那个表示的旋转变形() [单选题] *A、translateB、rotate(正确答案)C、scaleD、skew7. 以下那个属性用来设置背景图片大小() [单选题] *A、background-imageB、background-clipC、background-originD、background-size(正确答案)8. 以下那个属性用来设置背景图片的定位区域() [单选题] *A、background-imageB、background-clipC、background-origin(正确答案)D、background-size9. 以下那个属性值表示background-origin背景图片的定位区域是从内容开始的()[单选题] *A、padding-boxB、border-boxC、borderD、content-box(正确答案)10. 以下伪元素选择器那个描述的是当前处于可用状态的元素() [单选题] *A、:enabled(正确答案)B、:disabledC、:checkedD、::selection11. 以下伪元素选择器那个描述的是当前处于选中状态的元素() [单选题] *A、:enabledB、:disabledC、:checked(正确答案)D、::selection12. 以下那个属性用来定义过渡属性() [单选题] *A、transition-property(正确答案)B、transition-durationC、transition-timing-functionD、transition-delay13. 以下那个属性用来定义过渡执行的时间() [单选题] *A、transition-propertyB、transition-duration(正确答案)C、transition-timing-functionD、transition-delay14. 在JavaScript中,内置了日期函数Date,其中那个函数表示获取月份() [单选题] *A、Date.getFullYear()B、Date.getDate()C、Date.getMonth()(正确答案)D、Date.getHours15. 以下那个属性用来定义过渡延迟的时间() [单选题] *A、transition-propertyB、transition-durationC、transition-timing-functionD、transition-delay(正确答案)16. 以下那个属性用来定义动画延迟的时间() [单选题] *A、animation-nameB、animation-durationC、animation-timing-functionD、animation-delay(正确答案)17. 以下那个属性用来定义动画执行函数() [单选题] *A、animation-nameB、animation-durationC、animation-timing-function(正确答案)D、animation-delay18. 在编写代码过程中关键帧@keyframes的名字需要和那个属性值对应() [单选题] *A、animation-name(正确答案)B、animation-durationC、animation-timing-functionD、animation-delay19. 以下那个属性可以用来控制动画的播放和暂停() [单选题] *A、animation-state(正确答案)B、animation-durationC、animation-timing-functionD、animation-delay20. 以下那个属性可以用来控制动画执行的次数() [单选题] *A、animation-stateB、animation-durationC、animation-iteration-count(正确答案)D、animation-delay21. 以下那个属性用来定义动画执行时间() [单选题] *A、animation-nameB、animation-duration(正确答案)C、animation-timing-functionD、animation-delay22. JavaScript中document.getElementById的返回值的类型为?() [单选题] *A、ArrayB、Object(正确答案)C、StringD、Function23. 不是 input 在 html5 新的类型的是?() [单选题] *A、datetimeB、file(正确答案)C、colorD、range24. 以下说法正确的是() [单选题] *A、setInterval只运行一次。
浏览器兼容性面试题浏览器兼容性一直是前端开发中的一个重要问题。
在设计和构建网站时,我们必须考虑到不同浏览器之间的差异,以确保网站在各种浏览器中都能正常运行。
而面试中常会涉及到浏览器兼容性方面的问题,下面是一些常见的浏览器兼容性面试题:1. 什么是浏览器兼容性问题?浏览器兼容性问题指的是不同的浏览器在渲染网页时会出现显示、布局或功能等方面的不一致性。
这些问题可能是由于浏览器引擎的差异,CSS或JavaScript的实现差异,或者对特定标准的支持程度不同导致的。
2. 现代浏览器的兼容性问题主要有哪些方面?主要的浏览器兼容性问题包括:CSS兼容性,JavaScript兼容性,HTML5和CSS3新特性的支持,响应式布局在不同设备上的兼容性,以及特定浏览器的bug等。
3. 如何解决浏览器兼容性问题?解决浏览器兼容性问题可以采取以下几种方法:- 使用CSS重置或规范化库来规避浏览器默认样式的差异;- 使用CSS前缀来适应不同浏览器的私有属性;- 使用JavaScript库,如jQuery等,来封装兼容性代码;- 根据特定浏览器或版本写特定的CSS或JavaScript代码;- 使用polyfill或shim来实现不支持新标准的浏览器的特性;- 进行测试和调试,发现并修复兼容性问题。
4. 你对IE浏览器的兼容性有什么了解?IE浏览器(特别是低版本)一直以来都是兼容性问题的主要来源。
一些常见的IE兼容性问题包括:盒模型的差异、浮动元素引起的布局问题、select标签的样式问题、缺乏对标准API的支持等。
为了解决这些问题,可以使用条件注释、特定的CSS或JavaScript代码,以及针对IE的hack技术。
5. 你如何测试网站在不同浏览器中的兼容性?测试网站在不同浏览器中的兼容性可以采取以下几种方法:- 手动测试:在多个浏览器和不同设备上打开网站,并检查布局、样式和功能等方面的问题;- 使用跨浏览器测试工具:如BrowserStack、CrossBrowserTesting 等,在不同浏览器和设备上进行自动化测试;- 使用浏览器兼容性测试工具:如Can I use、CompatibilityJS等,来查找浏览器之间的差异和不兼容性;- 进行用户反馈:与真实用户沟通,了解他们在不同浏览器上的体验和问题,从而快速发现和解决兼容性问题。
html5css3⾯试题及答案,前端⾯试题及答案-CSS篇这篇⽂章并不是最全的前端⾯试题(没有最全,只有更全),只是针对⾃⼰⾯试过程中遇到的⼀些难题、容易忽略的题做⼀个简单的笔记,⽅便后⾯有⾯试需要的⼩伙伴们借鉴,后续内容会不定时更新,有错误之处希望⼤家不吝指出。
1、CSS3的新特性实现圆⾓(border-radius)阴影(box-shadow)⽂字加特效(text-shadow)线性渐变(gradient)旋转(transform)媒体查询,多栏布局具体2、CSS中 link 和@import 的区别link属于HTML标签,⽽@import是CSS提供的;页⾯被加载的时,link会同时被加载,⽽@import引⽤的CSS会等到页⾯被加载完再加载;import只在IE5以上才能识别,⽽link是HTML标签,⽆兼容问题;link⽅式的样式的权重 ⾼于@import的权重.3、介绍⼀下CSS的盒⼦模型通过css3新增的属性 box-sizing: content-box | border-box分别设置盒模型为标准模型(content-box)和IE模型(border-box)详细介绍两种盒模型:标准W3C盒模型、IE盒模型。
区别对⽐:(注意蓝⾊背景区域⼤⼩)标准盒模型元素宽度width=content=100px,⾼度计算相同IE模型元素宽度width=content + 2 x padding + 2 x border = 70px + 2 x 10px + 2 x 5px = 100px。
4、CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3新增伪类有那些?选择符1.id选择器( # myid)2.类选择器(.myclassname)3.标签选择器(div, h1, p)4.相邻选择器(h1 + p)5.⼦选择器(ul > li)6.后代选择器(li a)7.通配符选择器( * )8.属性选择器(a[rel = "external"])9.伪类选择器(a: hover, li:nth-child)继承1. 可继承的样式: font-size font-family color, text-indent;2. 不可继承的样式:border padding margin width height;新增伪类p:first-of-type 选择属于其⽗元素的⾸个元素。
HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件,容易维护、改版方便,不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;2.xhtml和html有什么区别HTML是一种基本的WEB网页设计语言,XHTML是一个基于XML的置标语言最主要的不同:XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。
3.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? 用于声明文档使用那种规范(html/Xhtml)一般为严格过度基于框架的html 文档加入XMl声明可触发,解析方式更改为IE5.5 拥有IE5.5的bug4.行内元素有哪些?块级元素有哪些?CSS的盒模型?块级元素:div p h1 h2 h3 h4 form ul行内元素: a b br i span input selectCss盒模型:内容,border ,margin,padding5.CSS引入的方式有哪些? link和@import的区别是?内联内嵌外链导入区别:同时加载前者无兼容性,后者CSS2.1以下浏览器不支持Link 支持使用javascript改变样式,后者不可6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?标签选择符类选择符 id选择符继承不如指定 Id>class>标签选择后者优先级高7.前端页面有哪三层构成,分别是什么?作用是什么?结构层 Html 表示层 CSS 行为层 js8.css的基本语句构成是?选择器{属性1:值1;属性2:值2;……}9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?Ie(Ie内核) 火狐(Gecko)谷歌(webkit) opear(Presto)10.写出几种IE6 BUG的解决方法1.双边距BUG float引起的使用display2.3像素问题使用float引起的使用dislpay:inline -3px3.超链接hover 点击后失效使用正确的书写顺序 link visited hover active4.Ie z-index问题给父级添加position:relative5.Png 透明使用js代码改6.Min-height 最小高度!Important 解决’7.select 在ie6下遮盖使用iframe嵌套8.为什么没有办法定义1px左右的宽度容器(IE6默认的行高造成的,使用over:hidden,zoom:0.08 line-height:1px)11.<img>标签上title与alt属性的区别是什么?Alt 当图片不显示是用文字代表。
html+css+js面试题87 . 如何求得2和4中最大的数?A) Math.ceil(2,4)B) Math.max(2,4)C) ceil(2,4)D) top(2,4)88 . 打开名为“window2”的新窗口的JavaScript语法是?A) open.new("","window2")B) window.open("","window2")C) new("","window2")D) new.window("","window2")89 . 如何在浏览器的状态栏放入一条消息?A) statusbar = "put your message here"B) window.status = "put your message here"C) window.status("put your message here")D) status("put your message here")90.下列不属于文档对象的方法的是()A)createElementB)getElementByIdC)getElementByNameD)forms.length91.下面这段代码运行的结果()<body><script language=”JavaScript”>document.writeln(“文档最后修改于”+stModified);var lastModObj=new Date(document. lastModified);alert(lastModObj.getMinutes());</script></body>A)弹出一个对象框B)没有任何输出C)在文档中显示文档最后修改的时间D)在对话框中显示文档最后修改的时间92.下列属性中表示文档中的未访问过的超链接的颜色是哪个()A)linkColor属性B)vlinkColor属性C)alinkColor属性D)以上都不是93.分析下面这段代码运行的结果()<script language=”JavaScript”>with(document){writeln(“最后一次修改时间:” +stModified+”<br>”);writeln(“标题:” +document.title+”<br>”);writeln(“URL:” +document.URL+”<br>”);}</script>A)只输出最后一次修改的时间B)只输出文档的标题C)输出文档的标题、最后一次修改时间和当前的URLD)什么也不输出94.分析下面这个程序运行的结果()<script language=”JavaScript”>var str=”字符串”with(document){writeln(“<b>您好,</b>”);write(“欢迎光临本网页!” +”<br>”);writeln(“<p><b>在js标签之间,”);writeln(str+”可以写在这里</b></p>”);}</script>A)会有”<br>”这样的字符输出B)第6行输出字符后会换行C)最后页面会出错D)会有乱码出现95.以下是历史对象的属性的是()A.CurrentB.LengthC.hrefD.Next96.分析下面这两行代码的作用()01 <A href=”javascript:history.back()”></A>02 <A href=”javascript:history.forward()”></A>A)代码第1行的作用相当于后退按钮B)代码第2行的作用相当于后退按钮C)代码第1行的作用相当于前进按钮D)以上表述不都不正确97.通常情况下,一个URL的格式是()A)协议//路径名称主机:端口/#哈希标识?搜索条件B)协议//主机:端口/#哈希标识/路径名称?搜索条件C)协议//主机:端口/路径名称?搜索条件D)协议//主机:端口?搜索条件/路径名称#哈希标识98. 对location对象的href属性的叙述错误的是()A) 可以获取当前路径B) 可以改变当前路径C) 可以用来刷新页面D) 是只读属性99. 可以使用下列哪种方法来用一个URL取代当前窗口的URL()A)loadB)onloadC)replaceD)open100.下列对表单对象的属性表述不正确的是()A)name:返回表单的名称B)action:返回/设定表单的提交地址C)target:返回/设定表单提交内容的编码方式D)length:返回该表单所含元素的数目101.对下面这段代码分析不正确的是()funtcion Submit(){form1.submit();alert(“提交成功”)}function Reset(){form1.reset();}A)调用Submit()可以提交表单B)调用Reset()重置表单C)调用Reset()相当于提交按钮D)调用Submit()相当于提交按钮102.对下面这段代码分析不正确的是()var len=form1.elements.length;for(var i=0 ;i<Len; i++){if(form1.elements[i].value.length==0){alert(“你的资料没有填写完善”);return flase;}}A)代码第1行是取得当前表单元素的个数B)代码第1行是取得当前文本表单的个数C)这是循环验证表单D)这段代码可以验证表单中文本框中的值是否为空103.对下面这段代码分析您输入的字符数为正确的是()function count(){var len=form1.text.value.length;alert(“”+len+”个”)}A)代码第3行是取得当前文档中文本框的个数B)代码第3行是取得当前文档中表单的个数C)这段代码有错误D)这段代码是统计用户输入文本框中字符个数104.下列叙述不正确的是()A)document:最顶层的节点,所有的其他节点都是附属于它的B)documentTypeDTD:引用(使用<!DOCTYPE>语法)的对象表现形式C)Attr:代表一对特性名和特性值。
这个节点类型能包含子节点D)documentFragment:可以像document一样来保存其他节点105.下列不属于访问指定节点的方法的是()A)obj.valueB)getElementByTagNameC)getElementsByNameD)getElementById106.对下列代码分析正确的是()function msg(){var p=document.createElement(“p”);var Text=document.createTextNode(“Hello!”);p.appendChild(“Text”);document.body.appendChild(p);}A)代码第2行是创建一个<P>元素标签B)代码第3行是创建一个文本节点C)<P>是文本节点的子节点D)这代码的作用是创建新的节点107.下列对符号所表示的意义解释错误的是()A)ˆ(尖号):匹配字符串的开头B)$(美元符号):匹配字符串的结尾C)?(问号):匹配前面的子表达式一次或多次D)\(反斜杠):对特殊字符的特殊元字符含义进行转义108. 对下面这段代码分析不正确的是()var reg=/ .o./ g; //寻找字符o前后接任意字符组成的有三个字符的字符串var str= “How are you?” //源串var result=new Array(); //用于接收结果while(reg.exec(str)!=null) //执行匹配操作,如果找到匹配则继续找下一项{result.push(stMatch); //添加结果}alert(result);A)代码第1行是寻找字符o前后接任意字符组成的有三个字符的字符串B)代码第4行是执行匹配操作,如果找到匹配则继续找下一项C)代码第6行是将所得到的结果添加到数组中D)最后输出的是“How are you?”109.以下不是RegExp对象的实例属性的是()A)global属性B)lastIndex属性C)ignoreCase属性D)multiLine属性110.下面与IE结合对JavaScript调试支持比较好的工具是()A)记事本B)Microsoft Visual Studio 2005C)JSEclipseD)VC++111. 在调试前的准备工作下列叙述不对的是()A)在“设置”列表框中找到两个“禁用脚本调试”复选框,将它们前面的钩去掉B)如果“禁用脚本调试”复选框,前面的钩不去掉,则不会弹出调试信息C)“禁用脚本调试”复选框,前面的钩去掉后,当程序出错时会弹出调试信息D)“禁用脚本调试”复选框,前面的钩去不去与调试无关112.关于代码优化下列表述不对的是()A)JavaScript程序代码编写出来后,主要是交给浏览器去运行B)尽可能使用全局变量,可以使代码简单C)书写风格应遵循“标识符短而含义清晰”、“代码缩进对齐”、“尽可能注释”等原则D)在机器上运行的代码总是希望其速度越快越好,阅读维护时其可读性可理解性最好113.弹出输入框,默认内容是“Hello World”的正确javascript语法是?A) document.write("Hello World") B) "Hello World"C) response.write("Hello World") D) prompt(“输入”,"Hello World") 114.JS特性不包括( )A)解释性B)用于客户端C)基于对象D)面向对象115.下列JS的判断语句中( )是正确的A)if(i==0)B)if(i=0) C)if i==0 then D)if i=0 then116、下列JavaScript的循环语句中( )是正确的A.if(i<10;i++)B.for(i=0;i<10)C.for i=1 to 10D.for(i=0;i<=10;i++)117、下列的哪一个表达式将返回假A.!(3<=1)B.(4>=4)&&(5<=2)C.(“a”==”a”)&&(“c”!=”d”)D.(2<3)||(3<2)118、下列选项中,( )不是网页中的事件A.onclickB.onmouseoverC.onsubmitD.onpressbutton119、有语句“var x=0;while(____) x+=2;”,要使while循环体执行10次,空白处的循环判定式应写为:A.x<10 B. x<=10 C.x<20 D.x<=20120、JS语句var a1=10;var a2=20;alert(“a1+a2=”+a1+a2)将显示( )结果A.a1+a2=30B.a1+a2=1020C.a1+a2=a1+a2D.显示错误121、将字串s中的所有字母变为小写字母的方法是( )A.s.toSmallCase()B.s.toLowerCase()C.s.toUpperCase()D.s.toUpperChars()122、以下( )表达式产生一个0~7之间(含0,7)的随机整数.A.Math.floor(Math.random()*6)B.Math.floor(Math.random()*7)C.Math. floor(Math.random()*8)D.Math.ceil(Math.random()*8)123、产生当前日期的方法是( )A.Now();B.Date()C.new Date()D.new Now()124、如果想在网页显示后,动态地改变网页的标题( )A.是不可能的B.通过document.write(“新的标题内容”)C. 通过document.title=(“新的标题内容”)D. 通过document.changeTitle(“新的标题内容”)125、某网页中有一个窗体对象,其名称是mainForm,该窗体对象的第一个元素是按钮,其名称是myButton,表述该按钮对象的方法是()A.document.forms.myButtonB.document.mainForm.myButtonC.document.forms[0].element[0]D.以上都可以126、HTML文档的树状结构中,()标签为文档的根节点,位于结构中的最顶层。