1.js基本数据类型
number string boolean underfined null
2.查找文档中的特定元素
document.getElementById("id");
document.getElementByTagName("div");
document.getElementByClassName("aa"); //有兼容问题
document.getElementByName("username"); //有兼容问题
3.定时器
setTimeout(function(){
执行代码
},time); //time为定时几秒
4.js获取块元素宽高
var oDiv = document.getElementById("id"); //获取元素id
oDiv.offsetWidth //offsetWidth = content padding border
oDiv.offsetHeight
oDiv.offsetLeft
oDiv.offsettop
oDiv.offsetParent
5.事件冒泡与事件捕获
事件冒泡:从触发的事件开始,自下而上的触发事件,默认为false // 我 -->爸爸 -->爷爷
事件捕获:从document到触发事件的节点,自上而下的触发事件,第三个参数为true // 爷爷-->爸爸-->我
然后,上代码
HTML:
1 <div id="div1">
2 <div id="div2" class="div2">
3
4 </div>
5 </div>
js:
事件冒泡(结果:div1 div2)
1 var oDiv1 = document.getElementById("div1");
2 var oDiv2 = document.getElementById("div2");
3 oDiv1.addEventListener("click",function (){
4 alert("div1被触发");
5 });
6 oDiv2.addEventListener("click",function (){
7 alert("div2被触发");
8 });
事件捕获(结果:div2 div1)
1 var oDiv1 = document.getElementById("div1");
2 var oDiv2 = document.getElementById("div2");
3 oDiv1.addEventListener("click",function (){
4 alert("div1被触发");
5 });
6 oDiv2.addEventListener("click",function (){
7 alert("div2被触发");
8 },true);
ps:阻止事件冒泡的函数:
jq: e.stopPropagation 可以实现到当前被触发元素为止,不再向上冒泡
更多专业前端知识,请上 【猿2048】www.mk2048.com