文章目录
函数
- 函数是一段可以反复调用的代码块
函数的声明
- function命令：function命令声明的代码区块，就是一个函数。function命令后面是函数名，函数名后面是一对圆括号，里面是传入函数的参数。函数体放在大括号里面。
function print(s){
console.log(s);
}
函数名的提升
- JavaScript引擎将函数名视同变量名，所以采用function命令声明函数时，整个函数会像变量声明一样，被提升到代码头部。
对象
- 简单说，对象就是一组“键值对”(key-value)的集合，是一种无序的符合数据集合。
- 对象的每一个键名又称为“属性”，它的键值可以是任何数据类型，如果一个属性的值为函数，通常把这个属性称为“方法”，它可以像函数那样调用。
math对象
- Math是JavaScript的原生对象，提供各种数学功能。
Math.abs()
Math.abs方法返回参数值的绝对值
Math.max()和Math.min()
- 返回一系列数字中的最大值和最小值
Math.floor()和Math.ceil()
Math.floor方法返回小于参数值的最大整数Math.ceil方法返回大于参数值的最小整数
Math.random()
Math.random返回0-1之间的一个伪随机数，可能等于0，但是一定小于1
Date对象
Date.now()
Date.now方法返回当前时间距离时间零点（1970年1月1日）的毫秒数，相当于 Unix时间戳乘1000。
Date对象中的Get方法
DOM概述
- DOM是JavaScript操作网页的接口，全称为“文档对象模型”（document object model）。它的作用是将网页转为一个JavaScript对象，从而可以用脚本进行各种操作（比如对元素的增删内容）
- DOM只是一个接口规范，可以用各种语言实现，所以严格地说，DOM不是JavaScript语法的一部分，但是DOM操作是JavaScript最常见的任务，离开了DOM，JavaScript就无法控制网页，另一方面，JavaScript也是最常用与DOM操作的语言。
节点
- DOM的最小组成单位叫做节点，文档的树形结构（DOM树），就是由各种不同类型的节点组成。每个节点可以看作是文档树的一片叶子。
节点树
- 浏览器原生提供document节点，代表整个文档
document代表整个文档树- 除了根节点，其他节点都有三种层级关系
- 父节点关系：直接的那个上级节点
- 子节点关系：直接的下级节点
- 同级节点关系：拥有同一个父节点的节点。
Node.nodeType属性
- 不同节点的nodeType属性值和对应的常量如下：
document对象_方法/获取元素
document.getElementsByTagName()
-
document.getElementsByTagName()方法搜索HTML标签名，返回符合条件的元素，它的返回值是一个类似数组对象(HTMLCollection实例)，可以实时反映HTML文档的变化，如果没有任何匹配的元素，就返回一个空集
var paras = document.getElementsByTagName('p'); -
如果传入
*，就可以返回文档中所有HTML元素
var allElements = document.getElementsByTagName('*')
document.getElementsByClassName()
-
document.getElementsByClassName()方法返回一个类似数组的对象（HTMLCollection实例），包括了所有class名字符合指定条件的元素，元素的变化实时反映在返回结果中。 -
由于class是保留字，所以JavaScript一律使用
className表示CSS的class -
参数可以是多个class，他们之间使用空格分隔。
document.getElementsByName()
document.getElementsByName()方法用于选择拥有name属性的HTML元素(比如<form> <radio> <img>等)，返回一个类似数组的对象(NodeList实例)，因为name属性相同的元素可能不止一个。
document.getElementById()—常用
-
document.getElementById()方法返回匹配指定id属性的元素节点，如果没有发现匹配的节点，则返回null -
注意：该方法的参数是大小写敏感的，比如，如果某个节点的
id属性是main，那么document.getElementById("Main")将返回NULL
H5新增方法
document.querySelector()
document.querySelector方法接受一个CSS选择器作为参数，返回匹配该选择器的元素节点，如果有多个节点满足匹配条件，则返回第一个匹配的节点，如果没有发现匹配的节点，则返回NULLvar el1 = document.querySelector('.myclass');
document.querySelectorAll()
document.querySelectorAll()方法与querySelector用法类似，区别是返回一个NodeList对象，包含所有匹配给定选择器的节点
document对象_方法/创建元素
document.createElement()
document.createElement()方法用来生成元素节点，并返回该节点
var newDiv = document.createElement('div')
document.createTextNode()
document.createTextNode方法用来生成文本节点(Text实例)，并返回该节点，它的参数是文本节点的内容
document.createAttribute()
document.createAttribute方法生成一个新的属性节点(Attr实例)，并返回它
Element对象_属性
- Element对象对应网页的HTML元素，每一个HTML元素，在DOM树上都会转化成一个Element节点对象。
Element.id
Element.id属性返回指定元素的id属性，该属性可读写
var p = document.querySelector('p')
p.id//返回p标签的id
Element.className
className属性用来读写当前元素节点的class属性，它的值是一个字符串，每个class之间用空格分隔
Element.classList
classList对象有下列方法
Element.innerHTML
Element.innnerHTML属性返回一个字符串，等同于该元素包含的所有HTML代码，该属性可读写，常用来设置某个节点的内容，它能改写所有元素节点的内容，包括<HTML> <body>元素
Element.innerText
innerText和innnerHTML类似，不同的是innerText无法识别元素，会直接渲染成字符串
innerText和innerHTML的区别
- innerHTML可以识别标签
- innerText会把标签识别成一个字符串