声明函数一般放在head里面,关键字是function
在JavaScript里,错误和异常是有区别的。错误是Error的一个实例。错误被创建并且直接传递给另一个函数或者被抛出。如果一个错误被抛出了那么它就变成了一个异常
注意
建议js引入的代码放在页面的下方
1. 操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素,可以使用 document.getElementById(id) 方法。
使用 "id" 属性来标识 HTML 元素
2.代码调试
使用alert(警告框) 或 console.log
3.其它
3.1 分号 ;
分号用于分隔 JavaScript 语句。
通常在每条可执行的语句结尾添加分号。使用分号的另一用处是在一行中编写多条语句。
在 JavaScript 中,用分号来结束语句是可选的。
一.使用方法
1.引入外部js文件:
在head标签中定义
标签, 通过src属性指定文件位置
当前文件引用外部js文件时,script中间不可以写代码(不会生效)
外部js文件只保留script中间代码即可
2.在页面任意位置添加
二.组成
ECMAScript : 语法
BOM: 浏览器对象模型, 描述与浏览器进行交互的方法和接口
DOM(Document Object Model): 文档对象模型, 描述处理网页内容的方法和接口
三.变量
声明变量的时候使用var关键字, 例如var a = 11;
JavaScript中声明变量的时候不需要像Java一样声明对象的类型, 一律使用var, 而且每一个语句结尾的;可以省略, 但是不建议这样操作
函数名与变量名同名,将取代之
四.数据类型
基本类型有六种: null,undefined,boolean,number,string,symbol(es6)
number,string,boolean在一定条件下,可以自动转为对象类型,即包装对象
理解和使用ES6中的Symbol
//String(字符串)、number(数字)、布尔、对象、Null、Undefined
其中 JS 的数字类型是浮点类型的,没有整型.NaN 也属于 number 类型,并且 NaN 不等于自身
.toString()方法, 可以把任意值转为字符串
在js中,如果一个变量不为空(0除外),进行布尔判断时,结果肯定为true
JavaScript 拥有动态类型,意味着相同的变量可用作不同的类型
字符串可以是引号中的任意文本。可以使用单引号或双引号
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量
NaN: not a number, 即非数值, 是number中一个非常特殊的数值
例如 var a = 18-"abc"; 很显然这是无法进行数学运算的, 因此打印a时, 会得到结果NaN, 代表它不是数字. 如果我们执行typeof(a)检测a的类型,返回值是number
任何涉及NaN的运算(例如NaN+8)结果都是NaN
NaN和任何值都不相等, 包括其自身
typeof 对于基本类型,除了 null 都可以显示正确的类型
typeof 对于对象,除了函数都会显示 object
对于 null 来说,虽然它是基本类型,但是会显示 object
在条件判断时,除了 undefined, null, false, NaN, ' ', 0, -0,其他所有值都转为 true,包括所有对象
4.1 运算符
== 判断的时候,只判断数值是否相等,不判断数据类型
=== 既判断值是否相等,也判断数据类型
5.函数
作用域链会向上查找变量定义,直到全局作用域.
var 存在变量提升的问题
let x=3;
function fn() {
console.log(x)
var x=6 //此行代码存在时,将输出undefined.改为let后,输出ReferenceError: x is not defined.去掉后输出全局变量3
}
fn()
普通函数中的this指向全局对象(浏览器中指向window,nodejs指向Object [global] {})
对象方法中的this指向对象本身(this运行在哪个对象下(谁调用),就指向哪个对象)
let o1={
age:18,
fun:function () {
console.log(this.age) //输出16.因为o2为调用者
}
}
let o2={
age:16,
fun:o1.fun
}
o2.fun()
5.1 通过标签的事件属性方式绑定
1.属性里定义 onclick="方法名()"
2.定义对应的函数
5.2 事件派发方式绑定
只能在页面加载成功之后调用
1.通过id获取一个元素
document.getElementById("id名")
2.btn.onclick=function(){
要执行的代码
}
入口函数
JS的window.onload事件必须要等到所有内容,以及外部图片之类的文件加载完之后,才会去执行
JS的入口函数window.onload=function(){}函数有一个覆盖的问题,当文档中出现2个window.onload函数的时候,后者会覆盖前者,导致功能实现不了
6. DOM改变 HTML 元素的样式
document.getElementById("id名").style.属性名="值"
" "不能省略
7.
7.1获取元素的内容
document.getElementById("id名").
innerHTML获取内部的整个元素
innerText 只获取字符串,即标签中间的文本,不包含标签本身
7.2 获取和设置属性的值
获取属性的值
1.如果是预定义好的属性,可以使用 document.getElementById("id名").属性名 的方式直接获取
2. getAttribute("属性名") 可以获取所有属性的值,包括自定义的
设置属性的值
setAttribute("属性名") 可以设置所有属性. 预定义的还可以使用.的方法