JS 单击事件

单击事件

<a href="http://www.baidu.com">百度</a>
<script type="text/javascript">
//获取元素
var a = document.getElementsByTagName('a')[0];

//单击事件
a.onclick = function() {
    alert('我是百度的连接哦!!!!');
    //阻止元素的默认行为
    return false;
}
</script>

e.g.

<style type="text/css">
    *{
        list-style:none;
        padding:0px;
        margin:0px;
    }
    li{
        width:150px;
        height:150px;
        float:left;
    }
</style>
<ul>
    <li style="background:#6666FF"></li>
    <li style="background:#99CC00"></li>
    <li style="background:#99FFFF"></li>
    <li style="background:#CC00FF"></li>
    <li style="background:#CC66CC"></li>
</ul>
<script type="text/javascript">
//获取li元素
var lis = document.getElementsByTagName('li');
//绑定单击事件
for(var i=0;i<lis.length;i++) {
    lis[i].onclick = function(){
        //获取当前正在点击的这个元素的背景颜色
        var color = this.style.background;
        //修改body背景颜色
        document.getElementsByTagName('body')[0].style.background = color;
    }
}
</script>