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、函数和匿名函数
匿名函数在使用完后不能重用。而使用有名字的函数能重用(即重复使用其功能)