也许你已经了解HTML标记(也称为结构),知道了CSS样式(也称为表示),会使用HTML+CSS创建一个漂亮的页面,但这还不够,它只是静态页面而已。我们还需使用JavaScript增加行为,为网页添加动态效果。
- 增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)
- 实现页面与用户之间的实时、动态交互(如:用户注册、登陆验证等)
为什么JavaScript非常值得我们学习?
- 所有主流浏览器都支持JavaScript。
- 目前,全世界大部分网页都使用JavaScript。
- 它可以让网页呈现各种动态效果。
- 做为一个Web开发师,如果你想提供漂亮的网页、令用户满意的上网体验,JavaScript是必不可少的工具。
(3)引用JS外部文件
可以把HTML文件和JS代码分开,并单独创建一个JavaScript文件(简称JS文件),其文件后缀通常为.js,然后将JS代码直接写在JS文件中。
JS文件不能直接运行,需嵌入到HTML文件中执行,我们需在HTML中添加如下代码,就可将JS文件嵌入HTML文件中。
(4)JS在页面中的位置
我们可以将JavaScript代码放在html文件中任何位置,但是我们一般放在网页的head或者body部分。
-
最常用的方式是在页面中head部分放置<script>元素,浏览器解析head部分就会执行这个代码,然后才解析页面的其余部分。 JavaScript代码在网页读取到该语句的时候就会执行。
注意: javascript作为一种脚本语言可以放在html页面中任何位置,但是浏览器解释html时是按先后顺序的,所以前面的script就先被执行。比如进行页面显示初始化的js必须放在head里面,因为初始化都要求提前进行(如给页面body设置css等);而如果是通过事件调用执行的function那么对位置没什么要求的。
JavaScript语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。
一行的结束就被认定为语句的结束,通常在结尾加上一个分号";"来表示语句的结束。
- “;”分号要在英文状态下输入,同样,JS中的代码和符号都要在英文状态下输入。
- 虽然分号“;”也可以不写,但我们要养成编程的好习惯,记得在语句末尾写上分号。
从字面上看,变量是可变的量;从编程角度讲,变量是用于存储某种/某些数值的存储器。我们可以把变量看做一个盒子,为了区分盒子,可以用BOX1,BOX2等名称代表不同盒子,BOX1就是盒子的名字(也就是变量的名字)。
定义变量使用关键字var,语法如下:
var就相当于找盒子的动作,在JavaScript中是关键字(即保留字),这个关键字的作用是声明变量,并为"变量"准备位置(即内存)。
变量名可以任意取名,但要遵循命名规则:
注意:运行结果考虑浏览器兼容问题。