<script>
//制作案例:点击一个按钮,弹出对话框
// 知识点:事件是有三部分组成 :1、事件源;2、事件类型 ;3事件处理程序 ;我们也称为事件三要素。
//(1) 事件源事件被触发的对象,这里是按钮对象。
var btn = document . getElementById('btn' );
//(2) 事件类型 如何触发什么事件比如鼠标点击(onclick) 还是鼠标经过还是键盘按下。
//(3) 事件处理程序 通过一个函数赋值的方式完成。
btn.onclick = function() {
alert('点秋香');
}
</script>
案例2:点击按钮改变图片
<body>
<button id="ldh"> 刘德华< / button>
<button id=" zxy" >张学友</button> <br>
<img src=" images/1dh.jpg" alt="">
<script>
//修改元素属性 src
// 1.获取元素
var ldh = document. getElementById( 'ldh');
var zxy = document . getElementById( zxy' );
var img =document . querySelector( ' img' );
// 2.注册事件处理程序
zxy .onclick = function() {
img.src =' images/zxy.jpg ”;
}
</ script>
</body>
|