Javascript基础

aston_c

已于 2022-11-09 19:32:31 修改

阅读量203

点赞数

分类专栏：前端文章标签： javascript 前端开发语言

于 2022-06-24 23:36:57 首次发布

本文链接：https://blog.csdn.net/cds7777/article/details/125453770

版权

前端专栏收录该内容

4 篇文章 0 订阅

订阅专栏

Javascript：客户端的一个脚本语言

Javascript是一门弱类型的语言，变量的数据类型由后面赋的值的类型决定

三大组成部分

ECMAScript：语句语法规范
BOM：浏览器对象模型（location）
DOM：文档对象模型（document）

数据类型

javascript基本数据类型：

String : 字符串
Number : 数字
Boolean : 布尔
Null : 空
Undefined : 未定义
Symbol : 用于防止属性名冲突

常用对象类型：

Object : 对象
Array : 数组
Function : 方法
Date : 日期
RegExp : 正则

DOM技术

HTML DOM：定义了访问和操作HTML文档的标准。

HTML DOM方法是能在HTML元素上执行的动作。
HTML DOM属性是能设置或改变的HTML元素的值。

Javascript能够访问HTML DOM，在DOM中，所有HTML元素都被定义为对象。

示例：

<html>
<head></head>
<body>
	<span id="one">hello</span>

	<script>
		var span = document.getElementById("one");
		span.innerHTML = "<input type='text'/>";
		span.firstChild.value = "new content"
	</script>
</body>
</html>

在上面的例子中，getElementById 是方法，而 innerHTML 是属性（innerHTML 表示当前节点的内容）。
firstChild 属性返回被选节点的第一个子节点，如果没有就返回 NULL。

显示效果：
在这里插入图片描述

基本用法

定义方法：

function hello(var num) {}

没有返回修饰符，方法内直接return即可。
（参数在定义的时候不写，调用的时候也是可以传参的）

简易示例：

<html>
	<head>

		<!-- Javascript的环境 -->
		<script type="text/javascript">

			var str = "hello javascript";
			var type1 = typeof str;

			console.log(str);

			str = 999;
			var type2 = typeof str;

			//javascript是弱类型语言，变量的数据类型由后面赋的值的类型决定
			alert("type1: " + type1 + " , type2: " + type2);

			var person = new Object();
			person.pid = "p001";
			person.pname = "马云";

			alert(person.pid + "_" + person.pname);

			//javascript中定义方法
			function showHand() {
				if (event && event.srcElement && event.srcElement.tagName == "H3") {
					var h3 = event.srcElement;
					//当鼠标悬浮在指定内容中时，显示手势
					h3.style.cursor = "hand";
				}
			}

		</script>

	</head>

	<body>
		
		<h3>标题一</h3>
		<!-- 当鼠标在此标题上的时候调用js中的showHand()方法 -->
		<h3 onmouseover="showHand()">标题二</h3>

	</body>
</html>