1 JavaScript引入方式
2 JavaScript 基础语法
2.1 输出语句
window.alert() 写入警告框 (可以省略window)
document.write() 写入HTML输出
console.log() 写入浏览器控制台
2.2 变量
var关键字定义变量
1 弱类型
2 作用域:全局变量
3 变量可以重复定义
let关键字定义变量,只在代码块内有效,且不允许重复声明。
const关键字定义常量,声明后只读且值不允许改变。
2.3 数据类型
JavaScript中分为 原始类型 和 引用类型
5种原始类型
number:数字(整数、小数、NAN(Not a Number))
string:字符、字符串、单双引号
boolean
null:对象为空
undefined:当声明的变量未初始化时,该变量的默认值是undefined
使用typeof运算符可以获取变量数据类型:
alert(typeof age);
2.4 运算符
基本与Java一致,只是在JavaScript中多了“===”运算符
== :判断类型是否一致,不一致则先进行类型转换后再比较其值
===:若类型不一致,直接返回false
类型转换:
其他类型转为number:
1.string:按照字符串字面值转为数字,若字面值不是数字则转为NaN。一般使用parseInt()
2.boolean:false转0,true转1
其他类型转为boolean:
1.number:0和NaN转为false,其他数字转为true
2.string:空字符串转为false,其他转为true
3.null:false
4.undefined:false
2.5 流程控制语句
同Java
2.6 函数
定义方式一:通过function关键字定义
function functionName(参数1,参数2...){
函数体
}
定义方式二:
var functionName = function(参数列表){
}
注意:
形式参数不需要类型,因为JavaScript是弱类型语言
返回值也不需要定义类型,可以在函数内部直接使用return返回
3 JavaScript常用对象
具体可以查看手册
1. Array
定义:
var arr = new Array(1,2,3); //方式一
var arr = [1,2,3]; //方式二
特点:数组边长变类型,类似于Java集合
方法:
push:添加方法
splice:删除元素
2.String
定义:
var str = new String("hello"); // 方式一
var str = "hello"; 方式二
方法:
charAt() 返回指定位置的字符串
indexOf() 返回字符串第一次出现的位置
trim() 去除字符串前后两端的空白字符
3.自定义对象
定义;
var 对象名称 = {
属性名称1:属性值1,
属性名称2:属性值2,
...
函数名称:function (形参列表){}
...
};
4 BOM
Browser Object Model 浏览器对象模型,JavaScript将浏览器各个组成部分封装为对象
组成:
Window:浏览器窗口对象
方法:
alert() 显示带有一段消息和一个确认按钮的警告框
confirm() 显示带有一段消息和确认/取消按钮的对话框,有返回值true/false
setInterval(function,毫秒值) 按照指定的周期(以毫秒计)来调用函数或计算表达式
setTimeout(function,毫秒值) 在指定的毫秒数后调用函数或计算表达式
Navigator:浏览器对象 (使用不多)
Screen:屏幕对象 (使用不多)
History:历史记录对象
使用:window.history.方法(); //其中window. 可以省略
方法:
back() 加载history列表中的前一个url,即浏览器中后退按钮的功能
forward() 加载history列表中的后一个url
Location:地址栏对象
使用:location.方法();
属性:href 设置或者返回完整的url
location.href = “http://www.baidu.com”; 跳转到百度首页
5 DOM
具体查看手册
Document Object Model 文档对象模型,将标记语言的各个组成部分封装为对象
组成:
Document:整个文档对象
获取Element对象:
getElementById()、getElementsByTagName()、getElementsByName()、getElementsByClassName
Element:元素对象
Attribute:属性对象
Text:文本对象
Comment:注释对象
6 事件监听
事件绑定两种方式
1. 通过HTML标签中的事件属性进行绑定
2.通过DOM元素属性绑定 (推荐使用)
常见事件
onclick 鼠标单击事件
onblur 元素失去焦点
onfocus 元素获得焦点
onload 某个页面或图像被完整加载
onsubmit 当表单提交时触发该事件
onkeydown 某个键盘的键被按下
onmouseover 鼠标被移到某元素上
onmouseout 鼠标从某元素移开