第一章 简单了解Javascript
1.1、JavaScript能用来干什么?
(1)数据的验证
(2)将动态的内容写入到网页当中(ajax)
(3)可以对事件做出响应
(4)可以读写html中的内容
(5)可以检测浏览器
(6)模拟动画
......
1.2、Javascript语法特点
(1)、javascript面向对象开发
(2)、事件驱动
(3)、松散型 弱类型
(4)、解释型语言。有宿主环境(浏览器)解释执行
1.3、Javascript的组成部分
(1)、ECMAscript(语法)
数据类型、运算符、流程控制、函数、面向对象等
(2)、BOM(浏览器对象模型)browser Object Model
(3)、DOM(文档对象模型)docment Object Model
第二章 Javascript特效开发第一阶段
2.1、js页面引入
嵌入式和引入式最为常用。
![](https://img.haomeiwen.com/i2194177/148986a693ce28ac.png)
重定向:
![](https://img.haomeiwen.com/i2194177/38b41dae329db7e6.png)
效果:
![](https://img.haomeiwen.com/i2194177/ba665fb4ebc5fd9f.png)
重定向后点a标签或提交按钮,都会执行alert()方法;
放置特点:
![](https://img.haomeiwen.com/i2194177/44e1bee2f906d92c.png)
注意:如果script是用来引入js文件的,那么这个script标签中间就不能写任何js代码。
![](https://img.haomeiwen.com/i2194177/96ca07b3ab3e6f23.png)
2.2、js输出工具
![](https://img.haomeiwen.com/i2194177/05154a28ddb01585.png)
![](https://img.haomeiwen.com/i2194177/acdcec36a3073ff9.png)
2.3、变量声明
![](https://img.haomeiwen.com/i2194177/c0bfeb75e08de3f9.png)
2.4、javascript命名规范
![](https://img.haomeiwen.com/i2194177/f56c48c0d23c793e.png)
分号表示一段功能体的结束,如果有换行可以不用分号。为了防止出错和书写规范,凡是能加分号的地方都加上。
2.5、Javascript中的数据类型
![](https://img.haomeiwen.com/i2194177/91268e366cab3785.png)
2.6、javascript运算符
js一般不用来做精准运算。
![](https://img.haomeiwen.com/i2194177/4c023f4a56d04c52.png)
算数运算符:
![](https://img.haomeiwen.com/i2194177/699f272f002653c8.png)
![](https://img.haomeiwen.com/i2194177/9401605f41edd0e0.png)
关系运算符:
![](https://img.haomeiwen.com/i2194177/428c72d71643c4d2.png)
![](https://img.haomeiwen.com/i2194177/7763201c8f4fb60b.png)
![](https://img.haomeiwen.com/i2194177/15efc4b3da5d0cf2.png)
赋值运算符:
![](https://img.haomeiwen.com/i2194177/54acf52810019b31.png)
逻辑运算符
![](https://img.haomeiwen.com/i2194177/ebae606dc371a9db.png)
![](https://img.haomeiwen.com/i2194177/4f2b83bdfd481e0a.png)
2.7、Javascript流程控制
![](https://img.haomeiwen.com/i2194177/8cdb13930a18e2ed.png)
1、选择结构:
![](https://img.haomeiwen.com/i2194177/a389bf03d613b10a.png)
![](https://img.haomeiwen.com/i2194177/2f366809268a0cee.png)
![](https://img.haomeiwen.com/i2194177/979e82dd736b9515.png)
if一般用于范围判断,switch一般用于精准值判断。
通过prompt返回的结果都是字符串类型的数据;
2、循环语句
![](https://img.haomeiwen.com/i2194177/790d465cd9cda026.png)
while循环与for循环区别:
![](https://img.haomeiwen.com/i2194177/f41bb2c54d66989e.png)
do...while先运行后判断;while循环先判断后执行。
continue 跳出本次循环,直接进入下次循环;
break 结束整个循环;
![](https://img.haomeiwen.com/i2194177/9c58b5e3edf70da8.png)
![](https://img.haomeiwen.com/i2194177/6a0e9323ab98c31d.png)
2.8、javascript函数
1、函数
![](https://img.haomeiwen.com/i2194177/001ea2b1a84ba0b6.png)
2、关键字
![](https://img.haomeiwen.com/i2194177/cae2f7758eb7683b.png)
![](https://img.haomeiwen.com/i2194177/481665b5df0782de.png)
函数的自调用:
![](https://img.haomeiwen.com/i2194177/fb659c8bba9c5dd4.png)
3、带参数的函数
![](https://img.haomeiwen.com/i2194177/2fa38b739df64137.png)
如果实参个数多余形参个数,那么多余的参数会被忽略,不会报错。
如果实参个数少于形参个数,那么没有对应值得形参默认值就是undefined。
4、函数的返回值
![](https://img.haomeiwen.com/i2194177/74be44b162ce520d.png)
5、变量的作用域
![](https://img.haomeiwen.com/i2194177/90bc5411275f5de1.png)
![](https://img.haomeiwen.com/i2194177/dcc70fedca921116.png)
6、内置顶层函数
![](https://img.haomeiwen.com/i2194177/6d74ca2733ce4db4.png)
![](https://img.haomeiwen.com/i2194177/395f61a2a52aee72.png)
(1)Number(参数)
![](https://img.haomeiwen.com/i2194177/837da9072bc682f5.png)
如果是null,返回0;
(2)parseInt(参数)
![](https://img.haomeiwen.com/i2194177/11c293712833063d.png)
可进行进制转换;
(3)parseFloat(参数)
![](https://img.haomeiwen.com/i2194177/5fdee8bd15622c37.png)
(4)isNaN(参数)
如果传进数据不能转成数字,返回true;如果能转成数字,返回false。
![](https://img.haomeiwen.com/i2194177/3235b2bf6f110322.png)
(5)eval(参数)
![](https://img.haomeiwen.com/i2194177/2eb08895fff8baf6.png)
![](https://img.haomeiwen.com/i2194177/890f87c5ec51a986.png)
结果:
![](https://img.haomeiwen.com/i2194177/ffb1a16dcfbdd8d1.png)
本篇文章讲的内容主要是Javascript入门基础知识点,后续内容详见《Javascript特效开发(二)》。
链接:www.jianshu.com/p/3e23c126117a
注:《Javascript特效开发(一)》与《Javascript特效开发(二)》主要是讲的Javacript的ECMAscript语法部分,属于最基础的语法部分,后续
《Javascript特效开发(三)》会对Javascript的DOM和BOM部分进行讲解。
如有问题欢迎交流。
如转载请注明出处,谢谢!
网友评论