函数
函数的定义
function后面没有名字匿名函数，使用一个变量来接受
注意事项
函数也有函数提升，函数表达式不能被提升,即在函数表达式之前不能调用函数，报错
形参和实参数量不同
递归
要有明确的终止条件,直到运行到不需要在递归的项
//斐波那契数列
function fib(n){
//第一项和第二项都是1
if(n==0||n==1) return 1
return fib(n-1)+fib(n-2)
}
局部变量
初次给变量赋值时，如果没有加var/let/const 则将定义全局变量
function fun(){
a=3;
}
fun();
console.log(a)//3
闭包
- 闭包是函数本身和该函数声明时所处的环境状态的组合。
- 每次创建函数时都会创建闭包
- 当闭包产生时，函数所处环境的状态会始终保持在内存中，不会在外层函数调用后被自动清除。这就是闭包的记忆性。
- 用途：模拟私有变量
- 注意：不能滥用闭包，否则会造成网页的性能问题，严重时可能导致内存泄露。所谓内存泄漏是指程序中己动态分配的内存由于某种原因未释放或无法释放。
function addCount(){
var count = 0;
return function(){
count++;
console.log(count);
};
}
var fun1 = addCount();
var fun2 = addCount();
//调用两次外部函数，返回两个互不相关的内部函数
fun1()//1
fun2()//1
fun2()//2
fun1()//2
立即执行函数IIFE
(function(){})()
- for循环的i是全局变量
DOM
nodeType
获取节点的方法
都要在小括号(" "),不一定是document,也可以是其他node节点
getElementById：直接写id名字不用加#号,如果页面上有相同id的元素，则只能得到第一个
querySelector：页面上有相同id的元素，则只能得到第一个，
var p = document.querySelector('#box p:nth-child(1)');
延迟运行
节点关系
- 文本节点,空白文本节点也是节点
只考虑元素节点
包括空白文本节点
innerhtml
改变元素节点的css样式
如何改变元素节点的HTML属性
添加节点
孤儿节点
插入节点
移动节点
删除节点
克隆节点
事件监听
事件对象
事件委托
注意事项
定时器，延时器
延时器类似
函数节流
无缝连续滚动
<style>
* {
padding: 0;
margin: 0;
}
.contain {
height: 200px;
width: auto;
overflow: hidden;
}
li {
height: 40px;
width: auto;
}
#list {
position: relative;
top: 0;
transition: top 2s linear 0s;
}
</style>
<body>
<div class="contain">
<ul id="list">
<li style="background-color: #234134">1</li>
<li style="background-color: #2fffff">2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>
</div>
<script>
var thistop = 0;
var op = document.querySelector(".contain");
var op1 = document.querySelector("#list");
op1.innerHTML += op1.innerHTML;
clearInterval(po); //设表先关，防止动画累计
//不能加var，要不然变成了局部变量，清除不了
po = setInterval(function () {
op1.style.transition = "top 1s linear 0s";
if (thistop <= -200) {
op1.style.transition = "none";
op1.style.top = 0;
thistop = -40;
//设置一个延时器，这个延时器时间可以是0，虽然是0，但是可以让我们过渡先是瞬间消失，然后再加上
setTimeout(function () {
op1.style.transition = "top 1s linear 0s";
op1.style.top = thistop + "px";
}, 0);
}
else {
thistop -= 40;
op1.style.top = thistop + "px";
}
}, 2000);
</script>
</body>
BOM(浏览器对象模型)
window对象
Navigator
History
Location
