JS基础:热身运动

写一个JS效果的步奏:

1.先实现布局
2.实现原理
3.了解JS语法

JS中如何获取元素:

1.通过ID名称来获取元素:
document get element by id 'link'

docuemnt.getElementById('link');

事件

事件:鼠标事件,键盘事件(按回车,空格找到),系统事件(调节窗口大小),表单事件(input表单),自定义事件
onclick
onmouseover
onmouseout
onmousedown
onmouseup
onmousemove

如何添加事件?用.

元素.事件

函数:可以理解为命令,做一件事

function abc(){//肯定不会主动执行的,需要调用!
……
}

因为不会主动执行,★要执行必须调用:直接调用和事件调用

调用方法1、直接调用:
abc()
调用方法2、事件调用: 元素.事件=函数名
 document.getElementById("link").onclick=abc;

匿名函数:

function abc(){}中的abc为函数名,函数名可以省略,

function (){}为匿名函数

调用方法3:匿名函数的调用:元素.事件=匿名函数
元素.事件=function (){}

什么时候是匿名函数,什么时候有名的函数?

有名的函数比如两个元素都同时指行一个命令时:

oStrong.onclick=show;//元素.事件=函数名
obtn1.onclick=show;
function show(){
    oDiv.style.display="block";
    oDiv.background.window="300PX";
    oDiv.style.background="yellow";
}

变量var

var a=var a= document.getElementById('link');
var num=123;
var name="leo";

加了变量后的进一步简写:

var a=document.getElementById("link");
a.onclick=abc;

测试:

alert(1);带了一个确认按钮的警告框;

系统事件:onload 加载完后再执行……

window.onload=要做的事情即函数
img.onload
body.onload
……


希望把某个元素移除你的视线:

1、display:none;显示为无
2、visibility:hidden; 隐藏,占有位置
3、width \ height
4、透明度
5、left \ top
6、拿一个白色DIV盖住它
7、margin负值

【补充说明】:关于函数http://www.jianshu.com/p/094e335d8373

你可能感兴趣的:(JS基础:热身运动)