day01-初级-JS0-热身运动、JS入门教程

js实现的步骤：

1、先实现布局

2、实现原理

3、了解JS语法

（a、获取元素 b、事件 c、添加事件 d、函数：做什么事）

注意：

1、display：none 显示为无，不占文档流

visibilITy：hiddeen 虽然显示为无，但是占文档流(犹如人披上隐身衣站你前面，当你经过还是会撞到)

2、事件中的系统事件 举个例子：窗口的缩放

事件中的表单事件 微博中用户名限制字数的长度

3、函数

假定函数名为abc

function abc(){ ...} //语句1

abc(); //语句2

只有当直接调用abc()时，才会执行语句1。说明语句1肯定不会自己主动执行。

当使用事件调用时，遵循 元素.事件=函数名

如：oDiv.onclick=abc; //注意这里abc不要变成abc()，因为abc()会执行他对应的函数，所以无论你是否点击，函数已经执行

4、js代码测试

从上往下执行，巧妙应用alert(1); 放在每个语句的前后进行测试。

5、p id="id1"> /p>

document.getElementById("id1").onclick=function (){ alert('hello world'); }

等同于 p.onclickfunction (){ alert('hello world'); }

6、代码从上往下执行(目前可以这样理解)

先把布局实现，然后在用js实现某个事件。当把js放在布局后用script标签能正常使用，但是当把script标签往布局前面移动时，系统会报错。因为先要找到这个元素，然而这个元素却没有出现。 此时可以用函数包裹，因为函数要调用才会执行 也可以用window.onload =function (){ ..} 页面加载完执行函数

7、函数和匿名函数

匿名函数在使用完后不能重用。而使用有名字的函数能重用（即重复使用其功能）

js实现的步骤：

1、先实现布局

2、实现原理

3、了解JS语法

（a、获取元素 b、事件 c、添加事件 d、函数：做什么事）

注意：

1、display：none 显示为无，不占文档流

visibility：hiddeen 虽然显示为无，但是占文档流(犹如人披上隐身衣站你前面，当你经过还是会撞到)

2、事件中的系统事件 举个例子：窗口的缩放

事件中的表单事件 微博中用户名限制字数的长度

3、函数

假定函数名为abc

function abc(){ ...} //语句1

abc(); //语句2

只有当直接调用abc()时，才会执行语句1。说明语句1肯定不会自己主动执行。

当使用事件调用时，遵循 元素.事件=函数名

如：oDiv.onclick=abc; //注意这里abc不要变成abc()，因为abc()会执行他对应的函数，所以无论你是否点击，函数已经执行

4、js代码测试

从上往下执行，巧妙应用alert(1); 放在每个语句的前后进行测试。

5、p id="id1"> /p>

document.getElementById("id1").onclick=function (){ alert('hello world'); }

等同于 p.onclickfunction (){ alert('hello world'); }

6、代码从上往下执行(目前可以这样理解)

先把布局实现，然后在用js实现某个事件。当把js放在布局后用script标签能正常使用，但是当把script标签往布局前面移动时，系统会报错。因为先要找到这个元素，然而这个元素却没有出现。 此时可以用函数包裹，因为函数要调用才会执行 也可以用window.onload =function (){ ..} 页面加载完执行函数

7、函数和匿名函数

匿名函数在使用完后不能重用。而使用有名字的函数能重用（即重复使用其功能）

觉得可用，就经常来吧！ 欢迎评论哦！ html5教程，巧夺天工，精雕玉琢。小宝典献丑了！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！