JavaScript修炼之道

第 1章 JavaScript入门 1

1.1　JavaScript概述　1

1.1.1　JavaScript发展历史　1

1.1.2　JavaScript组成部分及特点　2

1.1.3　JavaScript与Java的区别　3

1.1.4　JavaScript语法特点及编辑工具　3

1.1.5　JavaScript 的实际应用场景　4

1.1.6　JavaScript实现网页动态变化原理以及执行顺序　5

1.2　JavaScript代码的调试方法　6

1.2.1　使用alert()方法调试脚本代码　6

1.2.2　使用console.log()方法调试脚本代码　8

1.2.3　使用Chrome的“开发者工具”调试脚本代码　10

1.3　第 一个JavaScript实例　13

1.4　标识符、关键字和保留字　19

1.5　直接量　20

1.6　变量　20

1.6.1　使用var、let和const声明变量　20

1.6.2　变量的内存分配　23

1.6.3　变量提升和预解析　25

1.6.3　变量的作用域　32

1.6.4　作用域链　34

1.7　数据类型　37

1.7.1　使用typeof运算符检测数据类型　37

1.7.2　数字类型　38

1.7.3　字符串类型　39

1.7.4　布尔类型　41

1.7.5　函数类型　41

1.7.6　对象类型　42

1.7.7　null和undefined类型　42

1.7.8　数据类型的转换　43

1.7.9　isNaN()的应用　46

1.8　表达式和运算符　48

1.8.1　算术表达式　48

1.8.2　关系表达式　50

1.8.3　逻辑表达式　51

1.8.4　赋值表达式　55

1.8.5　条件表达式　56

1.8.6　new运算符　56

1.8.7　运算符的优先级及结合性　57

1.9　语句　58

1.9.1　表达式语句　58

1.9.2　声明语句　58

1.9.3　判断语句　59

1.9.4　循环语句　65

1.9.5　循环终止和退出语句　68

1.10　在网页中嵌入JS代码　70

1.10.1　在HTML标签的事件属性中直接添加脚本　70

1.10.2　使用script标签插入脚本代码　71

1.10.3　使用script标签链接外部JS文件　72

练习题　73

第　2章 Array及JSON　74

2.1　数组及其在图片切换中的应用　74

2.1.1　数组的创建及其元素的引用　75

2.1.2　数组的常用方法及属性　75

2.1.3　数组在图片切换中的应用　82

2.2　JSON　85

2.2.1　JSON数据格式及JSON变量的声明及应用　85

2.2.2　JSON与JS对象的相互转换及应用　86

2.2.3　使用for-in遍历对象属性　87

练习题　88

第3章　使用JavaScript操作属性及元素内容　89

3.1　使用JavaScript操作元素属性及样式属性　90

3.1.1　属性读、写操作　90

3.1.2　属性操作注意事项　91

3.2　使用classList属性操作类属性　98

3.3　使用cssText属性设置或修改元素行内样式　100

3.4　使用getComputedStyle()和currentStyle获取样式　102

3.5　使用innerHTML属性访问或设置元素内容　103

3.6　自定义属性及其在图片切换中的应用　105

3.6.1　自定义开关属性及其在图片切换中的应用　106

3.6.2　自定义数字属性及其在图片切换中的应用　107

3.6.3　自定义索引属性及其在图片切换中的应用　108

练习题　111

第4章　JavaScript函数　112

4.1　函数定义　112

4.2　return语句详解　114

4.3　函数调用　115

4.4　arguments实参集合对象　118

4.5　使用函数封装图片切换代码及函数传参实例　120

4.6　闭包　123

4.7　this指向及this的应用　128

4.8　内置函数　131

练习题　133

第5章　定时器、Math对象及Date对象　134

5.1　定时器　134

5.1.1　间歇定时器的创建与清除　134

5.1.2　延迟定时器的创建和清除　136

5.1.3　使用定时器实现图片轮播　137

5.2　Math对象　138

5.3　Date对象的创建及其常用方法　140

5.4　使用定时器、Date对象和Math对象实现倒计时效果　142

练习题　143

第6章　字符串　144

6.1　字符串概述　144

6.2　操作字符：charAt()、charCodeAt()和fromCharCode()　146

6.3　字符搜索方法：indexOf()和lastIndexOf()　148

6.4　截取字符串方法：substring()、substr()和slice()　150

6.5　分割字符串方法：split()　152

6.6　字符串大小写转换及字符串的比较　155

练习题　156

第7章　使用HTML DOM对象操作HTML文档　156

7.1　HTML DOM概述　156

7.2　节点类型　157

7.2.1　document根节点　158

7.2.2　使用document操作cookie　160

7.2.3　元素节点　163

7.2.4　属性节点　164

7.2.5　文本节点　165

7.3　使用HTML DOM访问HTML文档　166

7.3.1　获取文档元素　166

7.3.2　操作元素属性及元素内容　167

7.3.3　获取子节点　169

7.3.4　获取父节点和兄弟节点　171

7.3.5　获取元素的偏移位置　172

7.3.6　获取元素的绝对位置　174

7.3.7　获取元素的宽、高　175

7.4　使用DOM创建、插入、修改和删除节点　176

7.5　使用HTML DOM克隆节点　178

7.6　使用HTML DOM操作表单　179

7.6.1　表单对象　179

7.6.2　表单元素对象　180

7.7　使用HTML DOM操作表格　184

练习题　188

第8章　BOM对象　189

8.1　BOM结构　189

8.2　window对象　189

8.3　navigator对象　195

8.4　location对象　197

8.5　history对象　198

8.6　screen对象　199

练习题　200

第9章　事件处理　200

9.1　事件处理概述　200

9.2　事件处理程序的绑定　201

9.2.1　使用HTML标签的事件属性绑定处理程序　202

9.2.2　使用事件源的事件属性绑定处理程序　203

9.2.3　使用addEventListener()绑定处理程序　204

9.3　事件对象　205

9.4　事件流　206

9.4.1　事件冒泡　206

9.4.2　事件捕获　211

9.4.3　W3C标准事件流　213

9.5　绑定事件的取消　214

9.6　事件默认行为的取消　215

9.7　使用oncontextmenu事件自定义上下文菜单　217

9.8　焦点事件　218

9.9　键盘事件　220

9.10　鼠标拖拽事件　223

9.10.1　鼠标拖拽原理　223

9.10.2　鼠标拖拽问题及其解决方法　224

9.10.3　鼠标拖拽事件应用　227

9.11　鼠标滚轮事件　232

练习题　233

第　10章 使用正则表达式进行模式匹配　234

10.1　模式匹配的引出：找出字符串中的所有数字　234

10.2　正则表达式的定义　235

10.2.1　正则表达式的定义方式　235

10.2.2　正则表达式中的转义字符　236

10.2.3　正则表达式中的字符类　238

10.2.4　正则表达式中的量词　239

10.2.6　正则表达式中的首尾匹配、排除符和选择符　240

10.2.7　正则表达式中的分组　242

10.2.8　正则表达式中的修饰符　243

10.3　使用RegExp对象进行模式匹配　244

10.3.1　使用exec()进行模式匹配　244

10.3.2　使用test()进行模式匹配　245

10.4　使用string对象的模式匹配方法进行匹配　248

10.4.1　使用match()进行模式匹配　248

10.4.2　使用replace()进行模式匹配　249

10.4.3　使用search()进行模式匹配　251

10.4.4　使用字符串的模式匹配方法实现数据有效性校验　252

练习题　253

第　11章 JavaScript面向对象及组件开发　254

11.1　JavaScript面向对象编程概述　254

11.2　JavaScript对象的创建　255

11.3　对象属性和方法的访问方式　269

11.4　原型链　270

11.5　使用面向对象方式编写选项卡　273

11.6　包装对象　278

11.7　toString()和valueOf()　279

11.8　JavaScript对象的继承　281

11.8.1　通过原型链继承对象　281

11.8.2　通过借用构造函数实现继承　284

11.8.3　组合继承　286

11.8.4　拷贝继承　287

11.8.5　原型继承　289

11.8.6　寄生式继承　290

11.8.7　寄生组合式继承　292

11.8.8　类继承　293

11.8.9　对象继承在拖拽事件中的应用　298

11.9　JavaScript组件开发　301

11.9.1　组件开发概述　301

11.9.2　拖拽组件的创建及应用　302

11.9.3　弹窗组件的创建及应用　304

11.9.4　自定义事件　312

练习题　316

第　12章 Ajax编程　317

12.1　XMLHttpRequest对象　317

12.1.1　创建XMLHttpRequest对象实例　318

12.1.2　发送GET和POST请求　319

12.1.3　获取服务端返回的数据　324

12.2　使用 Ajax实现瀑布流布局　328

12.2.1　使用浮动布局瀑布流　328

12.2.2　使用绝对定位布局瀑布流　333

12.3　使用Ajax开发留言本　336

12.3.1　留言本涉及的数据库表　336

12.3.2　留言本的HTML和CSS代码及初始状态　336

12.3.3　留言本的用户注册　340

12.3.4　登陆留言本　343

12.3.4　退出留言本　345

12.3.5　发表留言　346

12.3.6　列表显示留言　349

12.3.7　使用Ajax实现类瀑布流布局效果的留言本　352

12.3.8　留言本的“顶”和“踩”　353

12.3　使用JSONP解决Ajax跨域问题　355

12.3.1　JSONP简介　355

12.3.2　使用JSONP实现百度下拉提示　358

练习题　361

第　13章 Javascript项目实战 - 云盘　361

13.1　项目结构　362

13.1.1　自适应屏幕的页面框架　362

13.1.2　页面头部布局　366

13.1.3　侧边栏布局　367

13.1.4　路径导航布局　369

13.1.5　文件夹区域布局　371

13.1.6　弹窗及右键菜单　373

13.2　数据结构　377

13.2.1　查找自己　378

13.2.2　查找子级　379

13.2.3　查找父级　379

13.2.4　查找所有父级　379

13.3　视图渲染　379

13.3.1　侧边栏菜单渲染　379

13.3.2　路径导航渲染　381

13.4　三大区域视图切换　381

13.4.1　左侧菜单点击事件添加　382

13.4.2　路径导航点击事件添加　382

13.4.3　文件夹点击事件添加　383

13.5　新建文件夹　383

13.5.1　添加一条新数据　383

13.5.2　文件夹命名处理　383

13.5.3　提示信息弹窗　384

13.5.4　完成新建文件夹功能　385

13.6　文件夹的右键菜单　385

13.6.1　右键菜单位置处理　385

13.6.2　删除当前文件夹　386

13.6.3　文件夹移动到　387

13.6.4　文件夹重命名　389

13.7　文件夹的选中及批量操作　392

13.7.1　点击全选框勾选全部　392

13.7.2　文件的选中操作　393

13.7.2　框选操作　393

13.7.3　批量操作文件夹　395