web前端开发笔记(1)

 一、HTML标签书写有哪些规范?

  1. 页面编码。
  2. 文档声明。
  3. 关键字与描述。
  4. 行内元素不能包含块级元素。
  5. a标签不能嵌套a标签。
  6. 标签名和属性必须用小写字母书写,属性必须加引号,标签必须闭合,单标签页必须闭合。
  7. 页面中不要用 进行缩进,如需缩进,用css控制。
  8. html标签使用必须语义化。
  9. 要为img标签填写alt和title属性。

二、Http状态码

  200 ok:
  一切正常,对GET和POST请求的应答文档跟在后面

  304 Not Modified:
  客户端有缓冲的文档并发出了一个条件性的请求(一般是提供If-Modified-Since头表示客户只想比指定日期更新的文档)。服务器告诉客户,原来缓冲的文档还可以继续使用。

  400 Bad Request:
  请求出现语法错误。

  403 Forbidden:
  资源不可用。

  404 Not Found:
  无法找到指定位置的资源。

  500 Internal Server Error:
  服务器遇到了意料不到的情况,不能完成客户的请求。

  501 Not Implemented:
  服务器不支持实现请求所需要的功能。例如,客户发出了一个服务器不支持的PUT请求。

三、css有几种引入方式?每一种具有哪些特点?

  1. 标签内引入:优先级最高,冗余代码多,代码量大,不易维护。
  2. 头部引入:加载速度快,没有服务器请求压力,相对于单页代码量少。代码量大,不易前后台沟通,不易改版与维护。
  3. 外部引入:一个css文件可控制多个页面,代码简洁,易于分工协作。有效利用缓存机制,外部引入中的href属性会给服务器造成请求的压力。 

四、圣杯布局

  实现圣杯布局实现的是三栏布局,两边的盒子宽度固定,中间盒子宽度自适应。

  圣杯布局:写结构时要先写中间盒子,因为中间盒子要优先渲染。通过浮动,定位来实现。

五、常见兼容性问题

  *png24位的图片在iE6浏览器上出现背景,解决方案是做成PNG8.。

  * IE6双边距bug:块属性标签float后,又有横行的margin情况下,在ie6显示margin比设置的大。

  浮动ie产生的双倍距离 #box{ float:left; width:10px; margin:0 0 0 10px;} 这种情况之下IE会产生20px的距离,解决方案是在float的标签样式控制中加入 ——_display:inline;将其转化为行内属性。(_这个符号只有ie6会识别)

  * IE下,可以使用获取常规属性的方法来获取自定义属性, 也可以使用getAttribute()获取自定义属性; Firefox下,只能使用getAttribute()获取自定义属性. 解决方法:统一通过getAttribute()获取自定义属性.

  * Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 可通过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.

  * 超链接访问过后hover样式就不出现了 被点击访问过的超链接样式不在具有hover和active了解决方法是改变CSS属性的排列顺序: L-V-H-A : a:link {} a:visited {} a:hover {} a:active {} 

六、跨域

  跨域指的是浏览器不能执行其它网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。

  解决办法:设置本域apache服务器的反向代理。

七、js和java的关系

  java是一种严格的面向对象的程序设计语言,常用于开发基于Internet的应用程序。javascript是一种脚本语言,常用语网页中增强交互性和页面效果,以及进行数据校验等。java是sun公司的产品,而javascript是NetScape公司推出的,二者没有任何联系。

八、css样式合并

  CSS样式合并,指的是一些不可分离的样式(按钮,图标等),将他们公共的样式部分进行合并,非公共的再次独立出来,以减小CSS文件的大小。

九、盒子模型

  外边距、内边距和边框之间的关系,及IE8以下版本的浏览器中的盒模型。

  ie 盒子模型和标准 w3c 盒子模型。

  标准 w3c 盒子模型的范围包括 margin、border、padding、content,并且 content 部分不包含其他部分。

  ie 盒子模型的范围也包括 margin、border、padding、content,和标准 w3c 盒子模型不同的是:ie 盒子模型的 content 部分包含了 border 和 pading。

十、js引入方式

  1. 使用<script></script>标签直接嵌入网页,一般放在head标签内,亦可以放在body标签内,只要保证这些代码在被调用前已读取并加载到内存即可。
  2. 使用外部的js文件,这样的好处是实现表现行为的分离、w3c非常提倡页面、样式、行为都分离,这样页面结构清晰,方便维护和团队的开发。在外部js文件中直接写js代码,引入方式是:<script type="text/javascript" src="a.js"></script>
  3. 直接作为某个标签的事件代码:<input type="button" value="确定" onclick="documet.write('hello')"/>

十一、js命名规范

  1. 区别大小写。
  2. 首字符必须是字母、下划线或美元符号。
  3. 除了首字符以外的字符,可以由数字、字母、下划线、美元符号等组成。
  4. 不允许包含空格。
  5. 不能以关键字或保留字命名。
  6. 变量名必须为小写字母。
  7. 类的命名使用骆驼命名规则。
  8. 简写单词不能使用大写名称作为变量名。
  9. 方法的命名必须为动词或动词短语。
  10. 公有类的命名必须使用混合名称命名。
  11. css变量的命名必须使用其对应的相同的公共类变量。
  12. 私有类的变量属性成员必须使用混合名称命名,并在前面划下划线。
  13. 变量如果设置为私有,则前面必须添加下划线。
  14. 通用的变量必须使用与其名字一致的类型命名。
  15. 所有的变量名必须使用英文名称。
  16. 变量如有较广的作用域,必须使用全局变量,此时可以设计成一个类的成员。相对的如作用域较小或为私有变量则使用简洁的单词命名。
  17. 如果变量有其隐含的返回值,则避免使用其相似的方法。
  18. 公有变量必须清楚的表达其自身的属性,避免字义含糊不清。
  19. 类构造函数可以使用扩展其基类的名称命名,这样可以正确、迅速的找到其基类的名称。

十二、js书写规范

  1. 文件编码统一为UTF-8。
  2. 书写过程中,每行代码结束必须有分号。
  3. 库引入,原则上仅引入jQuery库。
  4. 代码结构明了化,加适量注释,提高函数重用率。
  5. 注重与html分离,减少reflow,注重性能。
  6. 把外部js文件放在html底部,</body>前面。
  7. 优化循环。循环体中若有DOM操作,应该把DOM操作提到循环体外,在同一作用域内,DOM选择赋值给一局部变量。
  8. 避免混乱,建议在html中使用双引号,在js中使用单引号。
  9. 使用更简单的格式写innerscript。
  10. 避免混入其它技术,js不直接控制css样式的设置,控制classname。
  11. 避免全局变量。
  12. 声明变量总是用var。
  13. 获取对象属性的时候用方括号。
  14. 避免使用eval()方法。
  15. 不要省略 " 和 {}。

十三、Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?

  1. <!DOCTYPE> 声明位于文档中的最前面,处于 <html> 标签之前。告知浏览器的解析器, 用什么文档类型 规范来解析这个文档。
  2. 严格模式的排版和 JS 运作模式是 以该浏览器支持的最高标准运行。
  3. 在混杂模式中,页面以宽松的向后兼容的方式显示。模拟老式浏览器的行为以防止站点无法工作。
  4. DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现。

十四、js数据类型有哪些

  1. Number 数字类型
  2. String 字符串类型
  3. Boolean 布尔类型
  4. Function 函数
  5. Object 对象
  6. Null 空值
  7. Undefined 没有定义类型

十五、浏览器的内核分别是什么?

  IE浏览器的内核Trident、Mozilla的Gecko、Chrome的Blink(WebKit的分支)、Opera内核原为Presto,现为Blink;

十六、语义化的理解

  用正确的标签做正确的事情! html语义化就是让页面的内容结构化,便于对浏览器、搜索引擎解析; 在没有样式CCS情况下也以一种文档格式显示,并且是容易阅读的。 搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重,利于 SEO。 使阅读源代码的人对网站更容易将网站分块,便于阅读维护理解。

十七、谈谈this对象的理解

  this是js的一个关键字,随着函数使用场合不同,this的值会发生变化。 但是有一个总原则,那就是this指的是调用函数的那个对象。 this一般情况下:是全局对象Global。 作为方法调用,那么this就是指这个对象。

十八、规避javascript多人开发函数重名问题 

  1.   可以开发前规定命名规范,根据不同开发人员开发的功能在函数前加前缀   
  2.   将每个开发人员的函数封装到类中,调用的时候就调用类的函数,即使函数重名只要类名不重复就ok

十九、你如何对网站的文件和资源进行优化?

  解决方案有:文件合并、文件最小化/文件压缩、使用CDN托管、缓存的使用(多个域名提供缓存)等等。
  目前有很多前端自动化工具有整合文件的功能,比如gulp,我曾经写过一篇利用gulp解决微信浏览器缓存问题的文章,里面有写到如何合并压缩css、js文件,此类文章网上也有很多,大家有兴趣可以去看一下。

二十、什么是全局变量,什么是局部变量。

  将函数理解为盒子。

  在函数内声明的变量,就是局部变量,在函数外部不能访问。

  在函数外部声明的变量,就是全局变量,在函数内部可以访问。

 

欢迎留言~~

 

web前端开发笔记(2)

 

posted @ 2017-06-02 17:43  孟三秋  阅读(623)  评论(0编辑  收藏  举报