面试题总结

1.HTML元素的ID和name属性有什么区别

　　name原来是为了标识用的，但是现在根据规范，都建议用id来标识元素。

　　以下只能用name：   
  　　　1.    表单（form）的控件名，提交的数据都用控件的name而不是id来控制。

　　　　　　　　因为有许多name会同时对应多个控件，比如checkbox和radio，而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。

　　　　　　　　因此如果用id，服务器是无法得到数据的。   

　　以下只能用id：   
　　　　1.    label与表单控件的关联，   
　　　　　　<label for="MyInput">My  Input</label>   
　　　　　　<input id="MyInput"    type="text">   

　　　　2.    CSS的元素选择，以#MyId的方式指定应用样式的元素，不能用name替代。   

    
　　name与id的其他区别是：
　　　　1.  id要符合标识的要求，比如大小写敏感，最好不要包含下划线（因为不兼容CSS）。而name基本上没有什么要求，甚至可以用数字。

　　　　2.  ID主要当做选择器使用。

　　　　3.  name主要应用在交互式网页，表单提交给某个服务器端脚本后接收变处理量使用。

　　　　4.  js里要查询某个对象，建议用document.getElementById()方法，尽量不要直接使用NAME的值。

=====================================================================

2. jpg png gif 区别

简单粗暴地说，小图标，用png储存最好。

 

　　png支持透明，无压缩失真小；不支持动画；

 

　　gif 支持透明，支持动画；画质差只能保存256种颜色；

　　jpg适用于摄影图片，以及色彩丰富的图片。它采用压缩算法，通过强制渐变的方法来减小文件尺寸，但对于摄影之类的图片来说，jpg格式就会比png小很多了。

 

=====================================================================

3. 解释下浮动和它的工作原理？清除浮动的技巧？分别适用于什么情况？

　　浮动元素脱离文档流，不占据空间，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停了下来。

　　浮动元素引起的问题：
　　　　父元素的高度无法被撑开；

　　　　影响与父元素同级的元素、与浮动元素同级的非浮动元素（内联元素）会跟随其后若非第一个元素浮动，影响页面显示的结构

　　

　　清浮动的几种方法：

　　　　1.给浮动父级设置高度
　　　　【问题：扩展性不好，适用于后期页面结构变化不大的情况】

　　　　2.给父级也加浮动
　　　　【问题：页面中所有父级元素都要加浮动，margin左右自动失效（floats bad ！）】

　　　　3.给父级加 display：inline-block
　　　　【问题：margin左右自动失效，适用于不用自动居中的情况】

 

　　　　4.给浮动元素的父级加 after伪类 清浮动方法（现在主流方法）
　　　　.clear:after{content:'';display:block;clear:both;}
　　　　.clear{zoom:1;}

　　　　after伪类： 元素内部末尾添加内容；
　　　　　　:after{content"添加的内容";} IE6，7下不兼容
　　　　zoom 缩放 ：
　　　　　　a、触发 IE下 haslayout，使元素根据自身内容计算宽高。
　　　　　　b、FF 不支持；

 

=====================================================================