收集的一些前端面试题。
XHTML 和 HTML 有什么区别?XHTML: 基于 XML 的置标语言。元素必须被正确嵌套
元素必须关闭
标签名必须小写
文档必须有根元素
HTML: 基本的网页设计语言。
IE 和 DOM 事件流的区别IE 事件不加 on
this 指向问题
参数不同
执行顺序不同
display:none 和 visibility:hidden 的区别
答案:display:none 隐藏对应的元素,在文档布局中不再给它分配空间,它各边的元素会合拢,就当他从来不存在。
visibility:hidden 隐藏对应的元素,但是在文档布局中仍保留原来的空间。
position 的 absolute 与 fixed 共同点与不同点
答案: A:共同点:
1.改变行内元素的呈现方式,display 被置为 block;
2.让元素脱离普通流,不占据空间;
3.默认会覆盖到非定位元素上
B 不同点:
absolute 的” 根元素 “是可以设置的,而 fixed 的” 根元素 “固定为浏览器窗口。
当你滚动网页,fixed 元素与浏览器窗口之间的距离是不变的。
CSS 选择符
CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算? CSS3 新增伪类有那些?
CSS 选择符:
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
2.font-family
3.color
4.text-indent
不可继承的样式:
1.border
2.padding
3.margin
4.width
5.height
优先级算法:
1.优先级就近原则,同权重情况下样式定义最近者为准;
2.载入样式以最后载入的定位为准;
3.! important> id > class > tag
4.important 比 内联优先级高,但内联比 id 要高
CSS3 新增伪类举例:p:first-of-type 选择属于其父元素的首个
元素的每个
元素。
p:last-of-type 选择属于其父元素的最后
元素的每个
元素。
p:only-of-type 选择属于其父元素唯一的
元素的每个
元素。
p:only-child 选择属于其父元素的唯一子元素的每个
元素。
p:nth-child(2) 选择属于其父元素的第二个子元素的每个
元素。
:enabled:disabled 控制表单控件的禁用状态。
:checked 单选框或复选框被选中。
你知道多少种 Doctype 文档类型?该标签可声明三种 DTD 类型,分别表示严格版本、过渡版本以及基于框架的 HTML 文档。
HTML 4.01 规定了三种文档类型:Strict、Transitional 以及 Frameset。
XHTML 1.0 规定了三种 XML 文档类型:Strict、Transitional 以及 Frameset。
Standards(标准)模式(也就是严格呈现模式)用于呈现遵循最新标准的网页,而 Quirks(包容)模式(也就是松散呈现模式或者兼容模式)用于呈现为传统浏览器而设计的网页。
简单说一下浏览器本地存储是怎样的
在较高版本的浏览器中,js 提供了 sessionStorage 和 globalStorage。在 HTML5 中提供了 localStorage 来取代globalStorage。
html5 中的 Web Storage 包括了两种存储方式:sessionStorage 和 localStorage。
sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储。
而localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。
在 JavaScript 脚本中,isNaN 的作用是什么?
isNaN 的作用是判断值是否为数字
编写 JavaScript 脚本生成 1-6 之间的整数?var NowFrame;
NowFrame=Math.random( )*6+1
NowFrame=parseInt(NowFrame) // 把1-6之间的小数转化为整数
Ajax 的优缺点都有什么?
优点页面无刷新,用户体验非常好。
使用异步方式与服务器通信,具有更加迅速的响应能力。
可以把一些服务器负担的工作转到客户端,利用客户端闲置的能力来处理,减轻服务器负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax 的原则是 “按需取数据”,可以最大程度的减少冗余请求和响应对服务器造成的负担。
基于标准化并被广泛支持的技术,不需要下载插件或者小程序。
缺点:Ajax 不支持浏览器 back 按钮。
安全问题, Ajax 暴露了与服务器交互的细节。
对搜索引擎的支持比较弱。
破坏了程序的异常机制。
不容易调试。
简述一下 Ajax 的工作原理
Ajax 的核心是 JavaScript 对象XmlHttpRequest。该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户。
CSS+DIV 开发 Web 页面的优势有哪些?CSS+DIV,这个网页设计模式中,DIV 承担了网页的内容,CSS 承担了网页的样式。这样就使网页的内容和样式的分离开来。有利于页面的维护升级。
有助于提高搜索引擎亲和力(快速找到需要的数据,而不是像在 TABLE 中一层层的查找)
有助于页面的重构 (换皮肤如 blog,直接套用另外一套样式就可以实现,而不用改动网页脚本。)
==相等
== | 0 | “” | [] | false | undefined | null|
|—|—| —|—|—| —| —|
| 0 | - | true | true | true | |
| “”| true | - | true | true | | |
| [] | true | true | - | true | | |
| false | true | true | true | - | | |
| undefined | | | | | - | true |
| null | | | | | true | - |