javascript函数的静态加载与动态执行

函数定义是，已经写入了内存，是静态的模式，但是我们经常想得到的缺失动态效果

错误

var trs = document.getElementById("tr");var length = trs.length;for(var index=0;index<length;index++){    trs[index].onmouseover = function(){        trs[index].style.color = "red";    }}

函数定义时，只会加载进入内存，是不会执行的

对于函数内变量，重复的刷新只会保留最后刷新的值

通过静态的声明的函数，只能够实现一次的操作，多层的操作会报错

尤其是想通过循环将单一的函数操作赋予多个标签时

想要只定义一个方法，实现多重的动态操作，有两种办法

1. 对象指定：在对象属性直接声明，函数和标签直接分离，相当于传入参数后定制函数

function test(index){    var trs = document.getElementById("tr");    trs[i].style.color = "red";}

2. 动态接口：使用this关键字，让函数能够自动识别自身扮演角色，而不是呆板的单一模板

var trs = document.getElementById("tr");var length = trs.length;for(var index=0;index<length;index++){    trs[index].onmouseover = function(){        this.style.color = "red";    }}

自我识别，利用同一份模板，但是对于自身角色能够准确的识别

有生命的对象而不是沉闷的死物模板

3. 时间监听

   

var text = document.getElementById("text");text.addEventListener(type,func,model);

其中

type：事件类型，onclick...

func：执行的函数

model：响应类型，

    true：捕捉，先父后子

    false：冒泡，先子后父，默认

同一事件，可以同时绑定多个方法，分开添加事件即可