JavaScript HTML DOM 事件

最新推荐文章于 2023-07-04 14:22:00 发布

最爱林丽明小姐

最新推荐文章于 2023-07-04 14:22:00 发布

阅读量795

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript的基本语法

本文链接：https://blog.youkuaiyun.com/kissme_a/article/details/20059163

JavaScript的基本语法专栏收录该内容

17 篇文章

订阅专栏

本文提供了几个使用HTML与JavaScript实现元素交互的示例，包括通过点击修改文本内容及显示当前日期等实用功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

当用户在<h1>元素上点击时，会改变其内容。

<html>
<head>
<title>点击改变内容</title>
</head>
<body>
<h1 onclick = "this.innerHTML = '谢谢'">点击我</h1>
</body>
</html>

<html>
<head>
<title>点击改变内容</title>
<script>
function changetxt(id)
{
	id.innerHTML = "Thankyou!";
}
</script>
</head>
<body>
<h1 onclick = "changetxt(this)">点击我</h1>
</body>
</html>

<html>
<body>
<P>点击按钮就可以执行<em>displayDate()</em>函数。</P>

<button onclick = "displayDate()">点击这里</button>

<script>
function displayDate()
{
	document.getElementById("demo").innerHTML = Date();
}
</script>

<p id = "demo"></p>
</body>
</html>

<html>
<body>
<P>点击按钮就可以执行<em>displayDate()</em>函数。</P>

<button id = "demo">点击这里</button>

<script>
document.getElementById("demo").onclick = function()
{
	displayDate();
}
function displayDate()
{
	document.getElementById("dem").innerHTML = Date();
}
</script>

<p id = "dem"></p>
</body>
</html>