概述
- 简称 js
- 一种脚本语言,脚本语言的特点,JavaScript的目标程序是以普通文本的形式保存(不需要编译),可以用记事本直接打开。浏览器打开就直接解释执行了。
- JavaScript主要用来操作HTML中的节点,产生动态效果
- javaScript是一种事件驱动型的编程语言,通常都是在发生某个事件的时候,去执行某段代码。并且在JavaScript当中任何一个事件都有对应的时间句柄,所有的事件句柄都是以标签的属性形式存在。
JavaScript包括三块:ECMAScript、DOM、BOM
- ECMAScript是JavaScript核心语法
- DOM编程是通过JavaScript对HTML中的dom节点进行操作,DOM是有规范的,DOM规范是W3C制定的。
- BOM编程是对浏览器本身操作,例如:前进、后退、地址栏、弹窗等。由于浏览器有不同厂家制造,所以BOM缺少规范,一般只是一个默认的行业规范。(Browser Object Model 浏览器对象模型)
事件发生需要三要素:
- 监听器
- 事件源
- 事件
嵌入JS代码的三种方式
方式一:行间事件
<button type="button" onclick="myFunction()">尝试一下</button>
方式二:页面script标签嵌入(脚本块)
在脚本块中的JS代码在页面打开的时候自上而下依照顺序逐行执行,一个页面中脚本块可以出现多个,脚本块的位置随意,没有限制。
方式三:引入外部独立的js文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="myScript.js"></script>
</body>
</html>
JS变量的理解
怎么声明:
var + 变量名 ;
怎么赋值:
变量名 - 值;
一行能声明多个变量吗
var a ,b,c = 300;
声明三个变量abc,其中c赋值300,a和b没有赋值系统默认赋值undefined
JS语言是一种弱类型语言,没有编译阶段,直接浏览器打开解释执行,在JS中声明变量时不需要制定变量的数据类型,程序在运行过程中,赋什么类型的值变量就是什么数据类型,并且变量的数据类型时可变的。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script type="text/javascript">
var i ;
alert(i);//变量只声明没有赋值,系统默认赋值undefined,在js中undefined是一个具体存在的值
var x = "undefinded";
alert(x)//这里undefined是一个字符串
var k = 100 ;//声明后同时赋值
alert(k + 1)
k = "abc";//可以重新赋值
alert(k)
var a ,b ,c = 100 ;
alert(a)//undefined
alert(b)//undefined
alert(c)//100
</script>
</body>
</html>
函数初步
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
//JavaScript当中的函数定义格式
/**
function 函数名(形式参数列表){
函数体;
}
例如 function sum(a,b){
return a+b;
}
JS中的函数返回值类型不需要指定 应为变量可以接受任意类型
*/
//函数必须调用才执行
function sum(x,y){
alert(x+"----"+y);
}
// undefined----undefined
sum();
// 1----undefined
sum(1);
// 1----2
sum(1,2);
//但是不能加入超过形参个数的参数。
</script>
<!--在事件句柄当中调用sum函数-->
<input type="button" value="hello" onclick="sum(1,2)">
</body>
</html>
JS能重载吗
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
function test1(a,b){
alert("test1"+a+b)
}
function test1(){
alert("test1()")
}
test1();//只会执行最近的一个,在js中函数是不能重载的,也不存在重载机制
//只要出现重名函数,之前那个函数就会消失。
</script>
</body>
</html>