准备一个月读一本书并写下读书感悟,以便后续预习

第一章 JavaScript的简史

主要讲了当年W3C标准未出现之前,各个浏览器都需要前端人员去写多套代码,并且需要去判断是哪个浏览器,因为每个浏览器定义的标准不一样,这就加大的前端毫无意义的工作量,后来W3C标准制作之后,加上WPaS小组的大力推动,很多浏览器商都采用了W3C规定的浏览器规范,浏览器大战IE的获胜在于很多电脑都装windows系统,而windows系统预装的就是ie浏览器,不过现在很多手机都采用了webkit内核的浏览器（内核===浏览器引擎）;

第二章 JavaScript的语法

主要用于复习下前端JavaScript的语法,有语句 变量和数组以及操作符,函数和对象.(es5的就不写了)

第三章 DOM

D代表是document(文档),也就是文档,O代表obiect(对象),对象有用户自定义对象和宿主对象(浏览器提供的对象,如window对象,也就是bom对象)以及内置对象(JavaScript里面的对象),M代表模型.

节点

dom中有很多节点,元素节点:标签的名字就是元素节点, 文本节点:文本节点都基本都包含在元素节点里面,文字就是文本节点, 属性节点:属性节点都包含在元素节点中,一个属性就是属性节点

获取元素

document.getElementById(id名) //文档中每一个元素都是对象 document.getElementsByTagName(id名) //是一个数组 document.getElementsByTagClass(类名)

获取属性或添加属性

获取属性只能通过元素节点进行获取,不能通过dom对象进行获取
aa.getAttribute('title');
添加属性
aa.setAttrlbute('hti',13)

 

第四章 javascript图片库

这是一个小案例，不推敲了，太老的小项目了

第五章 最佳实践

主要讲了性能优化以及浏览器是否支持语法的判断条件

性能优化

冗余:相同目的的代码过多,应把代码进行优化减少相同目的代码的出现,减少冗余,冗余代码主要分两部分：多余执行的冗余和代码数量的冗余.

耦合度过高:各个模块依赖程度过高,缺少任何一个模块代码都运行不起来,应进行解耦,让代码对各个模块依赖程度减小,缺少某一模块也行能正常运行,只不过缺少了部分功能而已.

1. 分离代码，将js css代码进行分离,因为浏览器会对多个站点中使用缓存过的相同脚本.
2. js中减少dom的获取和标记,因为每一次dom的获取浏览器都会去搜索dom树,从中查找匹配的元素,所以尽量把搜索的次数减少.

*判断浏览器是否支持新语法

//当前浏览器要是不支持该语法将执行false,不执行下面代码
if（!document.getElementsByTagName||!document.getElementById）{
return false;
}
 

3. 对相同的代码进行复用,减少代码冗余,一段程序能够执行既定的任务，但是经过优化，能够同样达到目的，执行效率增强，且代码数量减少了，说明删除的代码就是程序的冗余代码。冗余代码主要分两部分：多余执行的冗余和代码数量的冗余.

4.把多个脚本文件进行合并,减少页面发送请求的数量,这也是性能优化首先考虑的.

5.我们平时喜欢把脚本文件放在head中,但是这种放置方法有一个问题,位于head标签中的脚本文件过多会导致浏览器无法并行加载其他文件,因为根据http规范来说,浏览器每次会从同一个域名中同时下载俩个文件,下载其间,浏览器不会下载其他任何文件,即使来自不同域名的也不会进行下载,所有其他资源要等脚本文件加载完毕后才会下载其他.所以要把脚本文件放到文档最后body之前,这样就可以让页面变的更快.

6. 压缩代码,压缩代码可以提高加快速度,去掉代码中的注释和空格,这样可以很好的减小文件大小.

第六章 案例研究

也没啥可写的这个案例研究,我就把自己认为有意义的写一下吧

1. 变量名不能采用JavaScript的保留字或方法,尽量采用和当前事情有意义的名字.
2. 函数设置只能设置一个出口和入口,也可以集中设置出口和入口,出口一般函数最开始.

function sum(a){
一个出口
if(!a)return;
第二个出口
if(a!=1)return;
//这俩个在一块集中所以可以算作是一个出口
出口一般都写在函数开头
}
//入口
sum(1)
入口
sum(2)
 

3. 最好是放到文档结尾且body结尾之前,这样最好也可以采用window.onload,因为脚本文件一旦放到head里面执行,则会js脚本加载完成了,但是此时的DOM是不完整的,有的元素则无法获取到,无法把事件绑定上去.

//onload事件,网页加载完毕后立即执行该事件
window.onload=function(){
放执行函数
}
 

4. 平稳退化:指的是如果不支持新的属性也可以退化到原始的页面,比如不支持js可以退化到支持html的使用,耦合度低.(结构和行为分离程度越大越好)

第七章 动态创建标记

没啥重要的,就讲了下创建元素,插入元素,以及一些插入元素的方法,下面直接讲重点ajax.

2005年ajax横空出世,用于概括异步加载的技术,以前web应用需要大量的刷新页面,用户点击请求,请求发送给服务端,服务端在
根据用户的操作在返回新页面.即使用户看到的只是一小部分的操作也要刷新和重新加载整个页面.使用ajax可以做到只更新页面
中的一小部分,其他内容不需要重新加载.
ajax的优势就是对页面的请求以异步的方式发送到服务器,而服务器不会用整个页面来响应请求,他会在后台处理请求,同时用户
还能继续浏览页面并与页面交互,脚本也可以按需加载和创建页面内容,不会打断用户的浏览体验.ie跟其他浏览器创建的xmlhttp
对象不同,以后出一下关于ajax书的阅读笔记.
ajax是异步的有的时候服务器可能反应快有的时候慢,如果是往本地硬盘发送ajax请求的话这请求个响应基本是同时的,如果是手
机浏览器,响应则需要很长时间
其中提到了hijax技术,不是极端的完全采用 ajax 数据与表现分离的做法,而是稍微对传统页面增强一下,javascript 仅仅作为
局部刷新的桥梁,所有逻辑仍然放在服务器上,相对于传统做法,Hijax 将页面进一步划分为分离的模块.当浏览器支持ajax时,只需
要将相应参数传递给要更新的模块页面,得到该模块产生的html，由javascript的innerHTML局部刷新该模块所在区域,当浏览器
不支持ajax时,则相应参数传递给整个页面刷新,相应模块读取参数更新.
 

第八章 充实文档的内容

html5的标准模式和怪异模式的区别?
html5的标准模式是W3C制定了统一的浏览器标准后,不同浏览器对页面的渲染有了统一的标准,即Strict mode（标准模式或
严格模式）;
html5的怪异模式是在W3C制定统一的浏览器标之前,不同的浏览器在页面的渲染上没有同一的规范,产生了差异,即Quirks mod
e(怪异模式或兼容模式);
 

第九章 无可写内容(内容过于老旧)

第十章 无可写内容(内容过于老旧)

第十一章 HTML5

讲述了html5新语义化标签,讲解了音频标签,canvas但是不够详细建议查看别的书籍或教程.

第十二章 项目

过于老旧不写了.