HTML DOM使得JavaScript有能力对HTML事件作出反应;
一、HTML事件有以下几类:
1.网页元素加载完毕;
- 网页加载完毕;
- 图像加载完毕;
2.鼠标移动到某个区域上;
3.鼠标点击某个区域或元素;
4.改变;
- 输入字段被改变;
- 提交HTML表单;
5.用户触发某个按键;
二、第一个例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程</title>
</head>
<body>
<h1 onclick="this.innerHTML='北京'">中国的首都是?(点击文本,获取答案)</h1>
</body>
</html>
点击右上角,选择某个浏览器打开,或者运行本文件(在IntelliJ IDEA中可按Ctrl+Shift+F10直接运行):
然后浏览器页面点击文字,获取答案,如果要再次执行,刷新页面即可;
点击之后:
分析:
<h1 onclick="this.innerHTML='北京'">中国的首都是?(点击文本,获取答案)</h1>
这里,我们看到,其作用机制是:
①点击事件的方法onclick放在标签里;一般是可以点击的标签,如标题标签<h1>
到<h6>
等;
②标签的的作用可以理解为覆盖;当点击发生,前面的内容小时,点击事件方法里的内容覆盖在原来内容上,并且还是在h1里面;在本方法中,只改变内容,不改变样式;其它的情况,得具体问题,具体分析;
具体大家可以访问菜鸟教程: