 |
位置：电子教程 > HTML DOM 教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
|
位置：电子教程 > HTML DOM 教程 (如果看不到内容请使用360浏览器) | 推荐学习资源 |
| HTML DOM 节点 |
| HTML DOM 方法 |
| HTML DOM 属性 |
| HTML DOM 访问 |
| HTML DOM - 修改 |
| HTML DOM - 元素 |
| HTML DOM - 事件 |
| HTML DOM 导航 |
| HTML DOM 总结 |
| 当前阅读教程：HTML DOM 教程 > 使用事件 | |
| 阅读(22555525) 收藏 赞(5685) 分享 | |
| 上一篇： 创建新的 HTML 元素 | 下一篇： HTML DOM - 元素 |
|
HTML DOM 允许您在事件发生时执行代码。 当 HTML 元素"有事情发生"时，浏览器就会生成事件： l 在元素上点击 l 加载页面 l 改变输入字段 下面两个例子在按钮被点击时改变 <body> 元素的背景色： 示例1：由函数执行代码 <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>点击改变背景色(2d5.net小白教程网)</title>
</head>
<body>
<script>
function ChangeBackground()
{
document.body.style.backgroundColor = "gray";
}
</script>
<input type="button" onclick="ChangeBackground()" value="修改背景颜色" />
</body>
</html>效果图
示例2：在按钮被点击时改变 <body> 元素的背景色 <input type="button" onclick="document.body.style.backgroundColor='gray';" value="修改背景颜色">
示例3：下面的例子在按钮被点击时改变 <p> 元素的文本： <!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>按钮点击改变元素的文本(2d5.net小白教程网)</title>
</head>
<body>
<p id="p1">Hello world!</p>
<script>
function ChangeText()
{
document.getElementById("p1").innerHTML="黄菊华老师，你好";
}
</script>
<input type="button" onclick="ChangeText()" value="修改文本" />
</body>
</html>效果图
|
|
| 上一篇： 创建新的 HTML 元素 | 下一篇： HTML DOM - 元素 |
