前端模拟试题javascript.docx
- 文档编号:10935396
- 上传时间:2023-02-23
- 格式:DOCX
- 页数:24
- 大小:29.03KB
前端模拟试题javascript.docx
《前端模拟试题javascript.docx》由会员分享,可在线阅读,更多相关《前端模拟试题javascript.docx(24页珍藏版)》请在冰豆网上搜索。
前端模拟试题javascript
JavaScript模拟试题
一、单选题
1.我们可以在下列哪个HTML元素中放置Javascript代码?
A.
B.
C.
D.
2.写"HelloWorld"的正确Javascript语法是?
A.("HelloWorld")
B."HelloWorld"
C.response.write("HelloWorld")
D.document.write("HelloWorld")
3.插入Javacript的正确位置是?
A.
部分B.
部分C.
部分和部分均可4.引用名为"xxx.js"的外部脚本的正确语法是?
A.
B.
C.
5.外部脚本必须包含
41.在JavaScript中定时调用函数foo()如何写?
参考答案:
functionfoo(){
alert("aaaa");
a=setTimeout(foo(),100);
}
foo();
8:
你做的页面在哪些流览器测试过?
这些浏览器的内核分别是什么?
经常遇到的浏览器的兼容性有哪些?
怎么会出现?
解决方法是什么?
点评:
css的兼容性也是大家关注的热点。
大家一定要注意多测试。
Javascript多浏览器兼容性问题及解决方案
兼容性处理要点
1、DOCTYPE影响CSS处理
2、FF:
设置padding后,div会增加height和width,但IE不会,故需要用!
important多设一个height和width
3、FF:
支持!
important,IE则忽略,可用!
important为FF特别设置样式
4、div的垂直居中问题:
vertical-align:
middle;将行距增加到和整个DIV一样高line-height:
200px;然后插入文字,就垂直居中了。
缺点是要控制内容不要换行
5、在mozillafirefox和IE中的BOX模型解释不一致导致相差2px解决方法:
div{margin:
30px!
important;margin:
28px;}
注意这两个margin的顺序一定不能写反,!
important这个属性IE不能识别,但别的浏览器可以识别。
所以在IE下其实解释成这样:
div{maring:
30px;margin:
28px}
重复定义的话按照最后一个来执行,所以不可以只写margin:
XXpx!
important;
浏览器差异
1、ul和ol列表缩进问题
消除ul、ol等列表的缩进时,样式应写成:
list-style:
none;margin:
0px;padding:
0px;
其中margin属性对IE有效,padding属性对FireFox有效。
[注]经验证,在IE中,设置margin:
0px可以去除列表的上下左右缩进、空白以及列表编号或圆点,设置padding对样式没有影响;在Firefox中,设置margin:
0px仅仅可以去除上下的空白,设置padding:
0px后仅仅可以去掉左右缩进,还必须设置list-style:
none才能去除列表编号或圆点。
也就是说,在IE中仅仅设置margin:
0px即可达到最终效果,而在Firefox中必须同时设置margin:
0px、padding:
0px以及list-style:
none三项才能达到最终效果。
2、CSS透明问题
IE:
filter:
progid:
DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
FF:
opacity:
0.6。
[注]最好两个都写,并将opacity属性放在下面。
3、CSS圆角问题
IE:
ie7以下版本不支持圆角。
FF:
-moz-border-radius:
4px,或者-moz-border-radius-topleft:
4px;-moz-border-radius-topright:
4px;-moz-border-radius-bottomleft:
4px;-moz-border-radius-bottomright:
4px;。
[注]圆角问题是CSS中的经典问题,建议使用JQuery框架集来设置圆角,让这些复杂的问题留给别人去想吧。
不过jQuery的圆角只看到支持整个区域的圆角,没有支持边框的圆角,不过这个边框的圆角可以通过一些简单的手段来实现,下次有机会介绍下。
4、cursor:
handVScursor:
pointer
问题说明:
firefox不支持hand,但ie支持pointer,两者都是手形指示。
解决方法:
统一使用pointer。
5、字体大小定义不同
对字体大小small的定义不同,Firefox中为13px,而IE中为16px,差别挺大。
解决方法:
使用指定的字体大小如14px。
并列排列的多个元素(图片或者链接)的div和div之间,代码中的空格和回车在firefox中都会被忽略,而IE中却默认显示为空格(约3px)。
6、CSS双线凹凸边框
IE:
border:
2pxoutset;。
FF:
-moz-border-top-colors:
#d4d0c8white;-moz-border-left-colors:
#d4d0c8white;-moz-border-right-colors:
#404040#808080;-moz-border-bottom-colors:
#404040#808080;
浏览器bug
1、IE的双边距bug
设置为float的div在ie下设置的margin会加倍。
这是一个ie6都存在的bug。
解决方案:
在这个div里面加上display:
inline;
例如:
<#divid=”imfloat”>
相应的css为
以下为引用的内容:
复制代码代码如下:
#IamFloat{
float:
left;
margin:
5px;/*IE下理解为10px*/
display:
inline;/*IE下再理解为5px*/
}
#IamFloat{
float:
left;
margin:
5px;/*IE下理解为10px*/
display:
inline;/*IE下再理解为5px*/
}
关于CSS中的问题实在太多了,甚至同样的CSS定义在不同的页面标准中的显示效果都是不一样的。
一个合乎发展的建议是,页面采用标准XHTML标准编写,较少使用table,CSS定义尽量依照标准DOM,同时兼顾IE、Firefox、Opera等主流浏览器。
很多情况下,FF和Opera的CSS解释标准更贴近CSS标准,也更具有规范性。
2、IE选择符空格BUG
今天在给博客的段落样式设置首字符样式的时候发现,原来一个空格也可以使样式失效。
请看以下代码:
复制代码代码如下:
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""//.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
--
p{font-size:
12px;}
p:
first-letter{font-size:
300%}
-->
对于世界而言,你是一个人;但是对于某个人,你是他的整个世界。
纵然伤心,也不要愁眉不展,因为你不知是谁会爱上你的笑容。
[/code]
复制代码代码如下:
DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""//.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
--
p{font-size:
12px;}
p:
first-letter{font-size:
300%}
-->
对于世界而言,你是一个人;但是对于某个人,你是他的整个世界。
纵然伤心,也不要愁眉不展,因为你不知是谁会爱上你的笑容。
这段代码对
的首字符样式定义在IE6上看是没有效果的(IE7没测试),而在p:
first-letter和{font-size:
300%}加上空格,也就是p:
first-letter{font-size:
300%}后,显示就正常了。
但是同样的代码,在FireFox下看是正常的。
按道理说,p:
first-letter{font-size:
300%}的写法是没错的。
那么问题出在哪里呢?
答案是伪类中的连字符”-”。
IE有个BUG,在处理伪类时,如果伪类的名称中带有连字符”-”,伪类名称后面就得跟一个空格,不然样式的定义就无效。
而在FF中,加不加空格都可以正常处理。
对css缩写的支持问题:
不论是ie还是ff对css的缩写都有一小点问题
比如
border:
0xpsolid#fff;两个浏览器支持都没有问题
但对于四个边的magin不同情况下,就不能用这种缩写了,无论是ie还是ff又会出现边界解释错误,而导致页面变形
正确缩写:
border-width:
0px1px2px3px;
border-style:
solid;
border-color:
#fff;
第二点是 ie对于css的maginpadding等默认值为0px,但ff却不一样,为了保持外观的统一性,即使padding为0你也要写上,以免ff在浏览中的错位。
IE与Firefox的CSS兼容大全
1.DOCTYPE影响CSS处理
2.FF:
div设置margin-left,margin-right为auto时已经居中,IE不行
3.FF:
body设置text-align时,div需要设置margin:
auto(主要是margin-left,margin-right)方可居中
4.FF:
设置padding后,div会增加height和width,但IE不会,故需要用!
important多设一个height和width
5.FF:
支持!
important,IE则忽略,可用!
important为FF特别设置样式,值得注意的是,一定要将xxxx!
important这句放置在另一句之上
6.div的垂直居中问题:
vertical-align:
middle; 将行距增加到和整个DIV一样高line-height:
200px;然后插入文字,就垂直居中了。
缺点是要控制内容不要换行
7.cursor:
pointer可以同时在IEFF中显示游标手指状,hand仅IE
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 前端 模拟 试题 javascript
![提示](https://static.bdocx.com/images/bang_tan.gif)