javascript/html/css专项训练——错题集
1、下列哪个样式定义后,内联(非块状)元素可以定义宽度和高度
正确答案: C 你的答案: A (错误)
display:inline
display:none
display:block
display:inherit
内联元素加上display：block;后被块级化。块级元素一般是其他元素的容器，可容纳内联元素和其他块状元素，块状元素排斥其他元素与其位于同一行，宽度(width)高度(height)起作用。因此，可以定义其宽度和高度。
| none | 此元素不会被显示。 |
| block | 此元素将显示为块级元素，此元素前后会带有换行符。 |
| inline | 默认。此元素会被显示为内联元素，元素前后没有换行符。 |
| inline-block | 行内块元素。（CSS2.1 新增的值） |
| list-item | 此元素会作为列表显示。 |
| run-in | 此元素会根据上下文作为块级元素或内联元素显示。 |
| compact | CSS 中有值 compact，不过由于缺乏广泛支持，已经从 CSS2.1 中删除。 |
| marker | CSS 中有值 marker，不过由于缺乏广泛支持，已经从 CSS2.1 中删除。 |
| table | 此元素会作为块级表格来显示（类似 <table>），表格前后带有换行符。 |
| inline-table | 此元素会作为内联表格来显示（类似 <table>），表格前后没有换行符。 |
| table-row-group | 此元素会作为一个或多个行的分组来显示（类似 <tbody>）。 |
| table-header-group | 此元素会作为一个或多个行的分组来显示（类似 <thead>）。 |
| table-footer-group | 此元素会作为一个或多个行的分组来显示（类似 <tfoot>）。 |
| table-row | 此元素会作为一个表格行显示（类似 <tr>）。 |
| table-column-group | 此元素会作为一个或多个列的分组来显示（类似 <colgroup>）。 |
| table-column | 此元素会作为一个单元格列显示（类似 <col>） |
| table-cell | 此元素会作为一个表格单元格显示（类似 <td> 和 <th>） |
| table-caption | 此元素会作为一个表格标题显示（类似 <caption>） |
| inherit | 规定应该从父元素继承 display 属性的值。 |
2、’css属性overflow属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。
正确答案: A 你的答案: A (正确)
True
False
参数是scroll时候，必会出现滚动条。
参数是auto时候，子元素内容大于父元素时出现滚动条。
参数是visible时候，溢出的内容出现在父元素之外。
参数是hidden时候，溢出隐藏。
3、新窗口打开网页，用到以下哪个值（）。
正确答案: B 你的答案: B (正确)
_self
_blank
_top
_parent
在html中通过<a>标签打开一个链接，通过 <a> 标签的 target 属性规定在何处打开链接文档。
如果在标签<a>中写入target属性，则浏览器会根据target的属性值去打开与其命名或名称相符的 框架<frame>或者窗口.
在target中还存在四个保留的属性值如下，
属性值
| 值 | 描述 |
|---|---|
| _blank | 在新窗口中打开被链接文档。 |
| _self | 默认。在相同的框架中打开被链接文档。 |
| _parent | 在父框架集中打开被链接文档。 |
| _top | 在整个窗口中打开被链接文档。 |
| framename | 在指定的框架中打开被链接文档。 |
这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略，因此，不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。
上面这段出自w3c。。
5、flash和js通过什么类如何交互?
正确答案: B 你的答案: D (错误)
ExtensionContex
ExternalInterface
IInterpolator
FlexContentHolder
Flash提供了ExternalInterface接口与JavaScript通信，ExternalInterface有两个方法，call和addCallback，call的作用是让Flash调用js里的方法，addCallback是用来注册flash函数让js调用。
6、元素的alt和title有什么异同，选出正确的说法？
正确答案: B 你的答案: C (错误)
不同的浏览器，表现一样
alt和title同时设置的时候，alt作为图片的替代文字出现，title是图片的解释文字
alt和title同时设置的时候，title作为图片的替代文字出现，alt是图片的解释文字
以上说法都不正确
alt是html标签的属性，而title既是html标签，又是html属性。
title标签这个不用多说，网页的标题就是写在<title></title>这对标签之内的。
title作为属性时，用来为元素提供额外说明信息。例如，给超链接标签a添加了title属性，把鼠标移动到该链接上面是，就会显示title的内容，以达到补充说明或者提示的效果。
而alt属性则是用来指定替换文字，只能用在img、area和input元素中（包括applet元素），用于网页中图片无法正常显示时给用户提供文字说明使其了解图像信息。
8、下面有关html5标签说法错误的有？
正确答案: B 你的答案: D (错误)
<audio> 标签定义声音，比如音乐或其他音频流
<canvas> 比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容
<menu> 标签定义菜单列表。当希望列出表单控件时使用该标签
<command> 标签定义命令按钮，比如单选按钮、复选框或按钮
这里考察HTML标签的使用：
<audio> 标签定义声音，比如音乐或其他音频流。 A正确。
<canvas> 标签定义图形，比如图表和其他图像。<canvas> 标签只是图形容器，您必须使用脚本来绘制图形。 B错误，<article>标签定义外部的内容。比如来自一个外部的新闻提供者的一篇新的文章，或者来自 blog 的文本，或者是来自论坛的文本。亦或是来自其他外部源内容。
<menu> 标签定义命令的列表或菜单。<menu> 标签用于上下文菜单、工具栏以及用于列出表单控件和命令。 C正确
command 元素表示用户能够调用的命令。<command> 标签可以定义命令按钮，比如单选按钮、复选框或按钮。只有当 command 元素位于 menu 元素内时，该元素才是可见的。否则不会显示这个元素，但是可以用它规定键盘快捷键。 D正确。
9、下述有关css属性position的属性值的描述，说法错误的是？
正确答案: B 你的答案: B (正确)
static：没有定位，元素出现在正常的流中
fixed：生成绝对定位的元素，相对于父元素进行定位
relative：生成相对定位的元素，相对于元素本身正常位置进行定位。
absolute：生成绝对定位的元素，相对于 static 定位以外的第一个祖先元素进行定位。
在html中网页可以看成一个立体的空间，一个完整的页面是由很多个页面堆积形成的，如下图所示
CSS中Position属性有四个可选值，它们分别是：static、absolute、fixed、relative。
◆position:static 无定位
该属性值是所有元素定位的默认情况，在一般情况下，我们不需要特别的去声明它，但有时候遇到继承的情况，我们不愿意见到元素所继承的属性影响本身，从而可以用position:static取消继承，即还原元素定位的默认值。
◆position:absolute 绝对定位
使用position:absolute，能够很准确的将元素移动到你想要的位置，
◆position:fixed 相对于窗口的固定定位
这个定位属性值是什么意思呢？元素的定位方式同absolute类似，但它的包含块是视区本身。在屏幕媒体如WEB浏览器中，元素在文档滚动时不会在浏览器视察中移动。例如，它允许框架样式布局。在页式媒体如打印输出中，一个固定元素会出现于第一页的相同位置。这一点可用于生成流动标题或脚注。我们也见过相似的效果，但大都数效果不是通过CSS来实现了，而是应用了JS脚本。
请特别注意，IE6不支持CSS中的position:fixed属性。真的非常遗憾，要不然我们就可以试试这种酷酷的效果了。
◆position:relative 相对定位
所谓相对定位到底是什么意思呢，是基于哪里的相对呢？我们需要明确一个概念，相对定位是相对于元素默认的位置的定位。既然是相对的，我们就需要设置不同的值来声明定位在哪里，top、bottom、left、right四个数值配合，来明确元素的位置。
static
元素框正常生成。块级元素生成一个矩形框，作为文档流的一部分，行内元素则会创建一个或多个行框，置于其父元素中。
relative
元素框偏移某个距离。元素仍保持其未定位前的形状，它原本所占的空间仍保留。
absolute
元素框从文档流完全删除，并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭，就好像元素原来不存在一样。元素定位后生成一个块级框，而不论原来它在正常流中生成何种类型的框。
fixed
元素框的表现类似于将 position 设置为 absolute，不过其包含块是视窗本身。
10、（*）下面有关浏览器中使用js跨域获取数据的描述，说法错误的是？
正确答案: A 你的答案: D (错误)
域名、端口相同，协议不同，属于相同的域
js可以使用jsonp进行跨域
通过修改document.domain来跨子域
使用window.name来进行跨域
只要 协议 、 域名 、 端口 有任何一个 不同, 都被当作是 不同 的域。
1.CORS
CORS（Corss-Origin Resource Sharing,跨资源共享），基本思想是使用自定义的HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应的成功或失败。即给请求附加一个额外的Origin头部，其中包含请求页面的源信息（协议、域名和端口），以便服务器根据这个头部决定是否给予响应。
2.document.domain
将页面的document.domain设置为相同的值，页面间可以互相访问对方的JavaScript对象。
注意：
不能将值设置为URL中不包含的域；
松散的域名不能再设置为紧绷的域名。
3.图像Ping
var img=new Image();
img.onload=img.onerror=function(){
... ...
}
img.src="url?name=value";
请求数据通过查询字符串的形式发送，响应可以是任意内容，通常是像素图或204响应。
图像Ping最常用于跟踪用户点击页面或动态广告曝光次数。
缺点：
只能发送GET请求；
无法访问服务器的响应文本，只能用于浏览器与服务器间的单向通信。
4.Jsonp
var script=document.createElement("script");
script.src="url?callback=handleResponse";
document.body.insertBefore(script,document.body.firstChild);
JSONP由两部分组成：回调函数和数据
回调函数是接收到响应时应该在页面中调用的函数，其名字一般在请求中指定。
数据是传入回调函数中的JSON数据。
优点：
能够直接访问响应文本，可用于浏览器与服务器间的双向通信。
缺点：
JSONP从其他域中加载代码执行，其他域可能不安全；
难以确定JSONP请求是否失败。
5.Comet
Comet可实现服务器向浏览器推送数据。
Comet是实现方式：长轮询和流
短轮询即浏览器定时向服务器发送请求，看有没有数据更新。
长轮询即浏览器向服务器发送一个请求，然后服务器一直保持连接打开，直到有数据可发送。发送完数据后，浏览器关闭连接，随即又向服务器发起一个新请求。其优点是所有浏览器都支持，使用XHR对象和setTimeout()即可实现。
流即浏览器向服务器发送一个请求，而服务器保持连接打开，然后周期性地向浏览器发送数据，页面的整个生命周期内只使用一个HTTP连接。
6.WebSocket
WebSocket可在一个单独的持久连接上提供全双工、双向通信。
WebSocket使用自定义协议，未加密的连接时ws://；加密的链接是wss://。
var webSocket=new WebSocket("ws://");
webSocket.send(message);
webSocket.onmessage=function(event){
var data=event.data;
... ....
}
注意：
必须给WebSocket构造函数传入绝对URL；
WebSocket可以打开任何站点的连接，是否会与某个域中的页面通信，完全取决于服务器；
WebSocket只能发送纯文本数据，对于复杂的数据结构，在发送之前必须进行序列化JSON.stringify(message))。
优点：
在客户端和服务器之间发送非常少的数据，减少字节开销。
11、（*）下面这个JS程序的输出是什么：
|
1 2 3 4 5 6 7 8 9 10 11 12 |
|
正确答案: A 你的答案: A (正确)
0 1 0
0 1 2
0 0 0
0 0 2
查了红宝石，要点如下：
（1）Function是引用类型：保存在堆中，变量f1,f2是保存在栈中；
（2）闭包：一个函数（产生新的作用域）定义的局部变量、子函数的作用域在函数内，
但是一旦离开了这个函数，局部变量就无法访问，所有通过返回子函数到一个变量f1的方法，让
f1指向堆中的函数作用域，这样可以使用局部变量i.
(3) 过程：
第一次f1() :f1=Foo()中，先执行Foo(): i = 0,return值返回给f1
(f1指向子函数 f1()=function(){.....},因为子函数没有 定义i，所以向上找到父函数定义的 i: )并执行子函数 输出i=0,再自加 i =1(覆盖了父函数Foo 的 i值);
第二次f1() : 执行的是子函数 Function(){ ..},输出的是父函数 的 i=1,再自加 i =2;
第一次f2():同第一次f1(),不同的是 f2指向堆中一个新的对象 function(){ ...},所有此i非彼i,输出i=0;如果
如果再次f2(),那么和第二次f1(),一样输出i=1;
14、下面有关javascript系统方法的描述，错误的是？
正确答案: B 你的答案: D (错误)
parseFloat方法：该方法将一个字符串转换成对应的小数
isNaN方法：该方法用于检测参数是否为数值型，如果是，返回true，否则，返回false。
escape方法： 该方法返回对一个字符串编码后的结果字符串
eval方法：该方法将某个参数字符串作为一个JavaScript执行
NaN,即非数值（Not a Number）是一个特殊的数值，这个数值用来表示一个本来要返回数值的操作数未返回数值的情况（这样就不会抛出错误了）。
针对NaN的特点，ECMAScript定义了isNaN（）函数。这个函数接受一个参数，该参数可以是任何类型，而函数会帮我们确定这个参数是否“不是数值”。isNaN（）在接受一个值后，会尝试将这个值转换为数值。某些不是数值的值会直接转换为数值，例如字符串“10”或Boolean值。而任何不能被转换为数值的值都会导致这个函数返回true。
16、（*）下面有关HTML的Doctype和严格模式与混杂模式的描述，错误的是？
正确答案: C 你的答案: D (错误)
<!DOCTYPE> 声明位于文档中的最前面，处于<html>标签之前。告知浏览器的解析器，用什么文档类型 规范来解析这个文档
在标准模式中，浏览器根据规范呈现页面；在混杂模式中，页面以一种比较宽松的向后兼容的方式显示
DOCTYPE不存在或格式不正确会导致文档以标准模式呈现
浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法
1.<!DOCTYPE> 声明位于文档中的最前面，处于 <html> 标签之前。告知浏览器的解析器，用什么文档类型 规范来解析这个文档。
2.严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。在混杂模式中，页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
3.DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。
17、（*）下面有关JavaScript中 call和apply的描述，错误的是？
正确答案: B 你的答案: D (错误)
call与apply都属于Function.prototype的一个方法，所以每个function实例都有call、apply属性
两者传递的参数不同，call函数第一个参数都是要传入给当前对象的对象，apply不是
apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入
call传入的则是直接的参数列表。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
call（）方法和apply（）方法的作用相同，他们的区别在于接收参数的方式不同。对于call（），第一个参数是this值没有变化，变化的是其余参数都直接传递给函数。（在使用call（）方法时，传递给函数的参数必须逐个列举出来。使用apply（）时，传递给函数的是参数数组）如下代码做出解释：
function add(c, d){
return this.a + this.b + c + d;
}
var o = {a:1, b:3};
add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16
add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34
18、下述有关border:none以及border:0的区别，描述错误的是？
正确答案: C D 你的答案: A D (错误)
border:none表示边框样式无
border:0表示边框宽度为0
当定义了border:none，即隐藏了边框的显示，实际就是边框宽度为0
当定义边框时，仅设置边框宽度也可以达到显示的效果
C:当定义border:none时，表示无边框样式，浏览器并不会对边框进行渲染，也就没有实际的宽度；
D:定义边框时，除了设置宽度外，还必须设置边框的样式才能显示出来。
果
border-style:none;//无边框
border-width:0;//边框宽度为0px
2.区别
（1）性能差异
border:0;浏览器对border-width、border-color进行渲染，占用内存。
border:none;浏览器不进行渲染，不占用内存。
Chrome：
border:none;>> border:initial none initial;
border:0;>> border:0 initial initial ;
Firefox、360：
border:none; >>border:medium none;
border:0;>> border:0 none;
计算出的样式：
border:0px none 元素color属性值;
（2）浏览器兼容
IE7-不支持border:none;
W3C提示：请始终把border-style属性声明到border-color属性之前，元素必须在改变颜色之前获得边框。
19、（*）下面有关CSS sprites说法错误的是？
正确答案: C 你的答案: D (错误)
允许你将一个页面涉及到的所有零星图片都包含到一张大图中去
利用CSS的“background-image”，“background-repeat”，“background-position”的组合进行背景定位
CSS Sprites虽然增加了总的图片的字节，但是很好地减少网页的http请求，从而大大的提高页面的性能
CSS Sprites整理起来更为方便，同一个按钮不同状态的图片也不需要一个个切割出来并个别命名
CSS Sprites在国内很多人叫css精灵，是一种网页图片应用处理方式。它允许你将一个页面涉及到的所有零星图片都包含到一张大图中去，这样一来，当访问该页面时，载入的图片就不会像以前那样一幅一幅地慢慢显示出来了。
利用CSS的“background-image”，“background- repeat”，“background-position”的组合进行背景定位，background-position可以用数字精确的定位出背景图片的位置。
利用CSS Sprites能很好地减少网页的http请求，从而大大的提高页面的性能，这也是CSS Sprites最大的优点，也是其被广泛传播和应用的主要原因；
CSS Sprites能减少图片的字节，曾经比较过多次3张图片合并成1张图片的字节总是小于这3张图片的字节总和。所以C错误
解决了网页设计师在图片命名上的困扰，只需对一张集合的图片上命名就可以了，不需要对每一个小元素进行命名，从而提高了网页的制作效率。
更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式，整个网页的风格就可以改变。维护起来更加方便。
20、下面列出的浏览器，无webkit内核的是（）
正确答案: D 你的答案: C (错误)
chrome
Safari
搜狗浏览器
firefox
Wekbit是一个开源的Web浏览器引擎，也就是浏览器的内核。Apple的Safari, Google的Chrome, Nokia S60平台的默认浏览器，Apple手机的默认浏览器，Android手机的默认浏览器均采用的Webkit作为器浏览器内核。Webkit的采用程度由 此可见一斑，理所当然的成为了当今主流的三大浏览器内核之一。另外两个分别是Gecko和Trident，大名鼎鼎的Firefox便是使用的Gecko 内核，而微软的IE系列则使用的是Trident内核。
另外，搜狗浏览器是双核的，双核并不是指一个页面由2个内核同时处理,而是所有网页（通常是标准通用标记语言的应用超文本标记语言）由webkit内核处理,只有银行网站用IE内核