⽜客⽹前端刷题错题整理(⼀)
错题回顾与总结
前⾔
看到朋友圈满天飞的内推和暑假实习⽣招募信息才恍然⼤悟已经⼤三下了,就⼜到了实习季了。
看到⾼中计算机专业的好友在⽜客⽹上刷了刷题,于是⾃⼰也想去试试。
做了⼆⼗道简单的选择题没想到正确率有75%还算不错?
但是还是感觉⾃⼰这块的基础知识有待加强,故打算今天开始多点看基础知识,复习同时多刷题,也做好每次的错题整理。
正⽂
1. 新窗⼝打开⽹页⽤到以下哪个值()
A._self
B._blank
C._top
D._parent
正解:B
解析:
例如
<a href="/XXXX" target="_blank" >打开新的⽹页</a>
值描述
_blank新窗⼝打开被链接⽂档(对web来说就是⽹页)
_self在相同的框架(⼀般编写中⼀个html⽂件就是⼀个框架)中打开(默认)
_parent在⽗框架打开
_top清除所有的框架,并在⽗⼦关系中最⾼的祖先框架中打开(也可以理解是清理了所有框架之后直接在本⽹页打开,对于没
有parent的框架来说就相当于_self的效果)
framename在指定的框架中打开手机打开svg
2. flash和js通过什么类如何交互?
正解:ExternalInterface
解析:
Flash(编写flash的语⾔为action script,即AS,与js语法风格相似)提供了ExternalInterface接⼝与JavaScript通信,ExternalInterface有两个⽅法,call和addCallback:
ExternalInterface.addCallback("在js⾥可调⽤的flash⽅法名",flash内⽅法) //在flash中通过这个⽅法公开在js中可调⽤的flash内的⽅法;
ExternalInterface.call("js⽅法",传给js的参数) //在flash⾥调⽤js⾥的⽅法
3. 下述有关css属性position的属性值的描述,说法错误的是?
A.static:没有定位,元素出现在正常的流中
B.fixed:⽣成绝对定位的元素,相对于⽗元素进⾏定位
D.absolute:⽣成绝对定位的元素,相对于 static 定位以外的第⼀个祖先元素进⾏定位
正解:B
解析:
值描述
absolute相对于static定位以外的第⼀个⽗元素进⾏定位
fixed相对于浏览器窗⼝进⾏定位
relative相对于其正常位置进⾏定位
static默认值,按照⽂档流出现在正常位置
inherit继承⽗元素中的position值
inherit继承⽗元素中的position值
值描述
4. 下⾯有关浏览器中使⽤js跨域获取数据的描述,说法错误的是?
A.域名、端⼝相同,协议不同,属于相同的域
B.js可以使⽤jsonp进⾏跨域
C.通过修改document.domain来跨⼦域
D.使⽤window.name来进⾏跨域
正解:A
解析:
只要协议、域名、端⼝有任何⼀个不同, 都被当作是不同的域。
A,B选项,关于跨域问题的深⼊理解详见本⼈。
C选项,document.domain设为相同的值后可以⽤来页⾯间互相访问JavaScript对象。有点类似jsonp,但是两个页⾯设置的url值必须是同⼀个域内的。
D选项,⾸先清楚window.name的特性:⼀个window⾥⾯可以有多个页⾯(或者frame),⽽window的属性都为这些页⾯所共⽤,⾃然name属性也⼀样,每个页⾯都对它有读写权限。因此利⽤window.name来跨域的思路(在同⼀个页⾯更新数据的情况下)就是利⽤⼀个隐藏的iframe来加载外域的数据(也就是src指向外域),等到这个iframe加载完毕我们就可以拿到它的window.name,也就是数据了,之后让src指向同源地址即可。
具体代码实现可以看。
扩充⼀些别的数据交互⽅式:
1. image ping
var img=new Image();
// do something
}
img.src="url?name=value";
请求数据通过查询字符串的形式发送,响应可以是任意内容,通常是像素图或204响应。图像Ping最常⽤于跟踪⽤户点击页⾯或动态⼴告曝光次数。但只能发送GET请求;⽆法访问服务器的响应⽂本,只能⽤于浏览器与服务器间的单向通信。
2. Comet
Comet可实现服务器向浏览器推送数据。
Comet是实现⽅式:长轮询和流
短轮询即浏览器定时向服务器发送请求,看有没有数据更新。
长轮询即浏览器向服务器发送⼀个请求,然后服务器⼀直保持连接打开,直到有数据可发送。发送完数据后,浏览器关闭连接,随即⼜向服务器发起⼀个新请求。其优点是所有浏览器都⽀持,使⽤XHR对象和setTimeout()即可实现。
流即浏览器向服务器发送⼀个请求,⽽服务器保持连接打开,然后周期性地向浏览器发送数据,页⾯的整个⽣命周期内只使⽤⼀个HTTP连接。
3. WebSocket
WebSocket可在⼀个单独的持久连接上提供全双⼯、双向通信。
WebSocket使⽤⾃定义协议,未加密的连接时ws://;加密的链接是wss://。
注意:
必须给WebSocket构造函数传⼊绝对URL;
WebSocket可以打开任何站点的连接,是否会与某个域中的页⾯通信,完全取决于服务器;
WebSocket只能发送纯⽂本数据,对于复杂的数据结构,在发送之前必须进⾏序列化JSON.stringify(message))。但这⼀点也会导致在客户端和服务器之间发送⾮常少的数据,减少字节开销。
关于websocket,笔者打算会再写⼀篇博客对此进⾏详解。
5. 下⾯有关HTML的Doctype和严格模式与混杂模式的描述,错误的是?
A.<!DOCTYPE> 声明位于⽂档中的最前⾯,处于标签之前。告知浏览器的解析器,⽤什么⽂档类型规范来解析这个⽂档
B.在标准模式中,浏览器根据规范呈现页⾯;在混杂模式中,页⾯以⼀种⽐较宽松的向后兼容的⽅式显⽰
C.DOCTYPE不存在或格式不正确会导致⽂档以标准模式呈现
D.浏览器根据DOCTYPE是否存在以及使⽤的哪种DTD来选择要使⽤的呈现⽅法
正解:C
解析:
A选项不⽤多解释。
B选项中的标准模式和混杂模式(quirks mode)也如选项所描述的⼀样按照不同⽅式去显⽰(此处向下兼容主要是指对⽼版本ie),当⽂档标明了,且位于⽂档头部也就是(xml声明也不能放在头部)前⾯的时
候,就是标准模式,反之或者在与xml⽣命之间加了标签、⽂本、注释就会是混杂模式。具体在显⽰的时候会有什么局别可以看看。
C选项,按照B选项解析的叙述可以知道doctype不存在会以混杂模式显⽰,故错误。
D选项,DTD(document type definition,⽂档类型定义),这⾥需要注意的是现在使⽤的html5标准中是不需要编写复杂的dtd的,但是html4中则是需要,并且有严格(strict)和过渡(transitional)两种不同的风格,详情我觉得可以好好阅读⼀下,当然了毕竟是⽐较过时的东西我们做个了解即可,阅读后会更有利于我们理解h5。
6. 下⾯有关CSS sprites说法错误的是?
A.允许你将⼀个页⾯涉及到的所有零星图⽚都包含到⼀张⼤图中去
B.利⽤CSS的“background-image”,“background-repeat”,“background-position”的组合进⾏背景定位
C.CSS Sprites虽然增加了总的图⽚的字节,但是很好地减少⽹页的http请求,从⽽⼤⼤的提⾼页⾯的性能
D.CSS Sprites整理起来更为⽅便,同⼀个按钮不同状态的图⽚也不需要⼀个个切割出来并个别命名
正解:C
先解释C选项,后半句是正确的,也是使⽤雪碧图的最重要原因,但是雪碧图总体⼤⼩是⽐各张图⽚字节之和要⼩的,所以选C。
⾄于ACD选项不逐⼀解析了,我们直接来了解雪碧图它本⾝:
css sprites 在html5⽀持svg之前,很多⽹站都会采⽤这种形式来处理图⽚。原理就是将图⽚或者说图标都集合到⼀张⼤的图⽚上,使⽤时通过利⽤CSS的“background-image”,“background-repeat”,“background-position”的属性组合进⾏背景定位,就可以把每个⼩图标分割出来使⽤。这样在加载⽹站必要资源的时候就只需要请求⼀张图⽚,减少http请求的次数从⽽提升页⾯的性能,并且如上所述⼀张⼤图⽚的字节是更少的,也不在需要对每个图标进⾏命名分类。但是它的缺点也很明显:⾸先需要制作⼀张⼤图⽚就⼗分费⼯夫,其次需要进⾏惊喜的定位来使⽤图标,这样也同时意味着兼容性和可维护性不好,显⽰的时候⼀旦不兼容,发⽣⾛位就⼜要重新调整位置,⼗分⿇烦。
7. 下⾯列出的浏览器,⽆webkit内核的是()
A.chrome
B.Safari
C.搜狗浏览器
D.Firefox
正解:D
解析:chrome、safari、还有诺基亚塞班平台默认浏览器都使⽤webkit内核,另外的内核有ie使⽤的trident内核,firefox使⽤的gecko内核,还有Opera浏览器使⽤的Presto内核(主要应⽤在⼿机的opera mini)。这⾥我们也复习⼀下css中的浏览器兼容前缀:
IE:-ms- firefox:-moz- opera:-o- chrome和safari:-webkit-
这⾥我们需要注意的是像搜狗浏览器这些国产浏览器有些是双核的,这⾥的双核也不是指两个内核同时处理⽽是普通的⽹页使⽤webkit内核,⽽⼀些特定的如银⾏⽹站就会使⽤trident内核。
总结
这些题⽬中其实并⾮完全是错题,有些可能是排除法做对了但是并不对每⼀个知识点都了解透彻,可见虽然在实际项⽬开发中使⽤的⽐较多但是基础知识还是需要⼀个⼀个去巩固好。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论