JavaScript快速入门

hello

button
function clic(){
document.write("lsf");//将会改变页面
}
button
function cl(){
document.getElementByIdx_x("p").title="go";//修改属性
}

div

c
function c(){

document.getElementByIdx_x("div").style.color="blue";//操作css
}

hello

click

document.getElementByIdx_x("btn").addEventListener("click",hello);//添加句柄

document.getElementByIdx_x("btn").addEventListener("click",word);//注意句柄和添加事件不一样，添加事件为
click

document.getElementByIdx_x("btn").addEventListener("click",world);

document.getElementByIdx_x("btn").removeEventListener("click",world);//移除句柄
function hello(){
alert("hello");
}
function word(){
alert("word");
}
function world(){
alert("word");
}

事件冒泡
事件冒泡由最具体的事件接受，传递到上一级，这里由button接收，到div再到body最后html
btn0
btn2
各种浏览器兼容

function btn(){
//html直接事件处理  html添加onClick="btn()"
alert("hello");
}
 
var bt=document.getElementByIdx_x("b");
bt.onclick=function(){alert("DOM0");}
bt.onClick=function(){alert("DOM00");}//多次添加只有最后一个有效
var
bt=document.getElementByIdx_x("b2").addEventListener("click",demo);
function demo(){
alert("DOM2");
}
var btm=document.getElementByIdx_x("mut");
if(btm.addEventListener){
btm.addEventListener("click",demo);
}else if(btm.attackEvent){
btm.attackEvent("onclick",demo);
}else{
btm.onclick=demo();
}
function demo(){
alert("DOM2");
}

按键
按键2

link

document.getElementByIdx_x("btn").addEventListener("click",showType)
function showType(event){
alert(event.type);//获得事件类型click
alert(event.target);//获得事件目标
}

document.getElementByIdx_x("div").addEventListener("click",showDiv);

document.getElementByIdx_x("btn").addEventListener("click",showButton)
function showDiv(event){
alert(event.type);
event.stopPropagation();//阻断事件上传
}
function showButton(event){
alert(event.type);
}

document.getElementByIdx_x("aid").addEventListener("click",NOshowA);
function NOshowA(event){
event.preventDefault();//本来a标签点击有跳转事件，现在阻止了
}

按钮

 

var mytime=setInterval(function(){
getTime();
},1000);//
function getTime(){
var d=new Date();
var t=d.toLocaleTimeString();
document.getElementByIdx_x("ptime").innerHTML=t;
}

document.getElementByIdx_x("btn").addEventListener("click",stopTime);
function stopTime(){
clearInterval(mytime);//停止计时器
}

document.getElementByIdx_x("ptime").addEventListener("click",myTimeOut);
function myTimeOut(){
alert("timeout");
setTimeout(function(){myTimeOut();},3000);//间隔多长时间停止
}
function stopTimeOut(){
clearTimeout(myTimeout);//停止timeout
}

click
assign

 

function getLoc(){

document.getElementByIdx_x("pid").innerHTML=location.hosename+","+location.pathname+","+location.port+","+location.href+","
}
function rassign(){
location.assign("http://www.baidu.com");
}