Javascript基础-优快云博客

本文链接：https://blog.youkuaiyun.com/xieixnxia/article/details/117599983

这篇博客介绍了JavaScript的引入方式，包括外部、内部和元素事件。讲解了基本语法，如变量命名规则、数据类型（基本和引用）以及运算符的使用。通过实例展示了算术、赋值、比较和逻辑运算。还涵盖了类型转换，包括隐式和显式转换，例如将字符串转为数字和数字转为字符串的方法。最后，文章演示了如何在网页中输出内容和进行条件判断。

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

Javascript引入方式

外部Javascript

内部Javascript

元素事件Javascript

外部，内部引入事Javascript文件不仅可以在head中引入，还可以在body中引入。

Document.write()：在也页面中输出一个内容。
alert()：弹出一个对话框。

语法基础

变量命名：

变量由字母、下划线、$或数字组成，并且第一个字母必须是“字母、下划线或$”
变量不能是关键字或保留字

数据类型：

基本数据类型：数字、字符、布尔值、未定义和空值
引用数据类型：数组、对象

在JavaScript中，所有变量都用var声明。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		var a = 10;
		a = a + 1;
		document.write(a);
		var str="白鹿为霜";
		document.write(str);
		document.write("白鹿为霜");
		var b=5;
		if(a>b){
			document.write("a大于b");
		}
		var n;
		document.write(n);
	</script>
	
</head>
<body>
</body>
</html>

运算符：

算数运算符：+、-、*、/、%、++、--
赋值运算符：=、+=、-=、*=、/=
比较运算符：>、<、>=、<=、==、!=
逻辑运算符：&&、||、！
条件运算符：var a = 条件 ? 表达式1 ：表达式2;

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
		var a = 10 + 4;
		var b = "Web前端开发"+"JavaScript";
		var c = "今年是"+2021;
		document.write(a+"<br/>"+b+"<br/>"+c);
		var x = 1;
		var y = 2;
		var n1 = x + y;
		var n2 = x - y;
		var n3 = x * y;
		var n4 = x / y;
		var n5 = x % y;
		document.write("x + y ="+n1+"<br/>");
		document.write("x - y ="+n2+"<br/>");
		document.write("x * y ="+n3+"<br/>");
		document.write("x / y ="+n4+"<br/>");
		document.write("x % y ="+n5+"<br/>");
		a += b;
		document.write(a);
		document.write("<br/>");
		var n6 = (a>b);
		var n7 = (a==b);
		var n8 = (a!=b);
		document.write(n6);
		document.write("<br/>");
		document.write(n7);
		document.write("<br/>");
		document.write(n8);
		document.write("<br/>");
		var n9 = n6&&n7;
		var n10 = n6||n7;
		document.write(n9);
		document.write("<br/>");
		document.write(n10);
		document.write("<br/>");
		var result = (1>2)?"真":"假";
		document.write(result);
		




	</script>

	
</head>
<body>
</body>
</html>

类型转换：

隐式类型转换：自动转换
显示类型转换：强制手动转换

“字符串”转换为“数字”

Number();
parseInt()和parseFloat();

Number()只能把纯“数字型字符串”转换为数字

parseInt()和parseFloat()是提取“首字母为数字的任意字符串”中的数字

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
	var a = Number("2017") + 1000;
	document.write(a);
	document.write("<br/>");
	document.write(Number("hao123"));
	document.write(parseInt("123"));
	document.write("<br/>");
	document.write(parseInt("hao123"));
	document.write("<br/>");
	document.write(parseInt("+123"));
	document.write("<br/>");
	document.write(parseInt("3.14"));
	document.write("<br/>");
	document.write(parseFloat("123"));
	document.write("<br/>");
	document.write(parseFloat("hao123"));
	document.write("<br/>");
	document.write(parseFloat("3.14"));
	document.write("<br/>");
	</script>

	
</head>
<body>
</body>
</html>

“数字”转换为“字符串”

与字符串相加
toString()

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<script type="text/javascript">
	var a = 2017 + "";
	var b = a + 1000;
	document.write(b);
	document.write("<br/>");
	var m = 2017;
	var n = m.toString()+1000;
	document.write(n);
	</script>

	
</head>
<body>
</body>
</html>