初学Javascript按钮

最新推荐文章于 2023-07-28 16:12:32 发布

帅锅打酱油

最新推荐文章于 2023-07-28 16:12:32 发布

阅读量2.7k

点赞数 1

分类专栏： javascript 文章标签：按钮 JavaScript

javascript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>1按钮显示时间</title>
<style>


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

<body>
<h2>1、点击按钮显示日期与时间</h2>
<p id="demo">这是一个段落</p>
<button type="button" οnclick="displayDate()">显示日期</button>

<h2>2、点击按钮弹出对话框</h2>
<p>
JavaScript能够对事件作出反应。比如对按钮的点击</p>
<button type="button" οnclick="alert('北京欢迎你！')">点我！</button>

<h2>3、js直接写入html body中</h2>
<script>
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落</p>")
</script>
<h2>4、找到元素改变内容</h2>
<p id="demo1">我恨你</p>
<script>
function myFunction(){
	x=document.getElementById("demo1");//找到元素
	x.innerHTML="我爱你，ww";
	}
</script>
<button type="button" οnclick="myFunction()">点击改变内容</button>
<h2>5.点击灯泡就可以打开或关闭这盏灯</h2>
<script>
function changeImage(){
	element=document.getElementById("myimage")
	if(element.src.match("dp2"))
	{
		element.src="image/dp1.png";
		}
		else{
			element.src="image/dp2.png"
			}
	}

</script>


<img id="myimage"  οnclick="changeImage()" src="image/dp1.png"/>
</body>
</html>

帅锅打酱油

关注

1
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
初学Javascript按钮

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;&lt;head&gt;&lt;m
复制链接

扫一扫