在HTML中使用javaScript

最新推荐文章于 2023-09-07 13:52:03 发布

QiuBO.

最新推荐文章于 2023-09-07 13:52:03 发布

阅读量2.4k

点赞数 1

文章标签： javascript html 前端

本文链接：https://blog.csdn.net/m0_70648941/article/details/126822346

版权

一.在HTML中使用javaScript的方法

把javaScript 代码写在<script>...</script>标签中，将标签插入到网页中

1.内部和外部

2.代码可以编写在 head,body,body外,html外

<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<!--javascript 代码是在script标签中编写-->
		<!--js代码可以编写在 head,body,body外,html外-->
		<!--<script  type="text/javascript">
			alert("Hello word!")
		</script>-->
		<!--引入css样式-->
		<link rel="stylesheet" type="text/css" href="css/new_file.css"/>
		<!--引入js样式-->
		<script type="text/javascript" src="js/index.js"></script>
	</head>
	<body>
		<h1 class="main">h1标签</h1>
		<a href="http://www.baidu.com" class="m"href="javascript:alert('百度')">百度</a>
		<script  type="text/javascript">
			alert("Hello word!")
	</body>
</html>

//外部引用
alert("这是一个外部js文件")

二.JavaScript 的数据类型

基本数据类型引用数据类型

数值数据类型 number 字符串类型 string

布尔类型 boolean Array 数组类型

未定义数据类型 undefined 对象类型 Object

空数据类型 null

使用typeof运算符可以查看变量的数据类型

在js中，变量的数据类型跟该变量后面赋的值的类型有关

<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			//声明一个变量，用来储存学生姓名
			var stuName//声明一个变量
			
			stuName="张三"//给变量stName进行赋值
			
			alert(stuName)//通过弹出框的方式将变量的值弹出
			
			document.write(stuName)//将变量的值打印在页面上
			
			document.write("<br/>")//换行
			document.write(stuName)
			
			//经常用于代码调试，通过控制台进行打印输出
			console.log(stuName)
			
			
			//在声明时直接给变量赋值
			var stuSex="男"
			//同时声明多个变量
			//var x,y,z=10
			var x=y=z=10
			console.log(x)
			console.log(y)
			console.log(z)
			//查看变量的数据类型
			console.log(typeof stuName)//string类型
			console.log(typeof stuSex)//number类型
			var ischecked=true 
			console.log(typeof  ischecked)//boolean 类型
			//在js中，变量的数据类型跟该变量后面赋的值的类型有关
			后面的值是什么
			
			
			//多种数据类型进行混合运算
			console.log(10+12.5)
			console.log(typeof(10+"12.5"))
			console.log(typeof(10+true ))
			console.log(10+true)
			
		</script>
	</body>
</html>

三.混合计算数据类型

整数与小数=小数小数与布尔型=小数

整数与字符串=字符串小数与空值=小数

整数与布尔型=整数字符串与布尔型=字符串

整数与空值=整数字符串与空值=字符串

小数与字符串=字符串布尔型与空值=整数

<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
//多种数据类型进行混合运算
			console.log(10+12.5)
			console.log(typeof(10+"12.5"))
			console.log(typeof(10+true ))
			console.log(10+true)
			
		</script>
	</body>
</html>



<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script type="text/javascript">
			var num_1=prompt("请输入第一个数字:")
			var num_2=prompt("请输入第二个数字:")
			console.log(typeof num_1)
			console.log(typeof num_2)
			//parseInt():将一个字符串类型转换成整数
			var result=parseInt(num_1)+parseInt(num_2)
			console.log(result)
			//parseFloat():将一个字符串类型转换成小数
			console.log(parseFloat("12.5"))
		</script>
	</body>
</html>

parseInt():将一个字符串类型转换成整数

parseFloat():将一个字符串类型转换成小数

QiuBO.

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
在HTML中使用javaScript

整数与空值=整数字符串与空值=字符串。整数与布尔型=整数字符串与布尔型=字符串。整数与字符串=字符串小数与空值=小数。小数与字符串=字符串布尔型与空值=整数。2.代码可以编写在 head,body,body外,html外。
复制链接

扫一扫