2020.08.05（javaweb）（3）

最新推荐文章于 2024-07-26 11:41:15 发布

Spirit °

最新推荐文章于 2024-07-26 11:41:15 发布

阅读量98

点赞数

分类专栏： javaweb 文章标签： javascript js html web

本文链接：https://blog.csdn.net/spiritttt/article/details/107900906

版权

javaweb 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

Day 13：

JavaScript

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
	<!-- 1.JavaScript代码写在HTML中的script标签中 -->
	<script type="text/javascript">	
		//2.借助window.onload事件在文档加载完成后执行程序
		window.onload = function() {
			//3.从文档中获取<button id="btnId">SayHello</button>标签对应的元素节点对象
			var btnEle = document.getElementById("btnId");
			//4.绑定单击事件响应函数
			//给按钮对象的单击事件属性赋值一个函数的引用
			btnEle.onclick = function() {
				//5.在事件的响应函数中弹出警告框
				window.alert("欢迎大数据专业");
			};
		};
		window.onload = btninput();
	</script>
</head>
<body>
	<input type="submit" value="SayHello" id="btnId" />
</body>
</html>

输出：
在这里插入图片描述

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	var a=20;
	var b='abc';
	var c=true;
	alert(a +"" +b + " " +c);
	a="Hello";
	b=230.53;
	c=["good",true,20];
	alert(a + "" + b + "" + c);
</script>
</head>
<body>
</body>
</html>

输出：
在这里插入图片描述

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">	
	//在JavaScript中创建对象
	//1.new Object()
	var objByNew = new Object();
	objByNew.userName = "Tom2014";
	objByNew.password = "123456";	
	alert(objByNew.userName+" "+objByNew.password);	
	//2.JSON格式
	//{属性名01:属性值01,属性名02:属性值02,...}
	var objByJSON = {
			userName : "Jerry",
			password : "654321"
		};
	alert(objByJSON.userName+" "+objByJSON.password);
</script>
</head>
<body>
</body>
</html>

输出：
在这里插入图片描述

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	window.onload = function(){
		//1.从文档中获取按钮对象
		var btn = document.getElementById("btnId");
		//2.声明一个事件响应函数
		/* function myClick() {
			alert("Bom!");
		} */		
		//3.将响应函数的引用赋值给按钮对象的onclick属性——绑定
		/* btn.onclick = myClick; */		
		btn.onclick = function () {
			alert("Bom!~~~");
		}; 	
	}
</script>
</head>
<body>
	<button id="btnId">SayHello</button>
</body>
</html>

输出：
在这里插入图片描述

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
	function a(){
		alert('hello world')
	}
	</script>
</head>
<body>
	<!-- 写在HTML标签内，结构与行为耦合，不推荐 -->
	<button onclick="a()">SayHello</button>
</body>
</html>

输出：
在这里插入图片描述

Spirit °

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2020.08.05（javaweb）（3）

Day13：JavaScript<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>Insert title h
复制链接

扫一扫

专栏目录