JavaScript学习-从入门到入土(一)

JavaScript-从入门到入土

    • JavaScript简介
    • 前端开发者的核心工作
    • JavaScript基本介绍
    • JavaScript应该有三个组成部分
    • JavaScript的使用
    • JavaScript里的变量
      • 变量命名规则

JavaScript简介

JavaScript 是属于 HTML 和 Web 的编程语言。
JavaScript 是 web 开发者必学的三种语言之一:

  • HTML 定义网页的内容
  • CSS 规定网页的布局
  • JavaScript 对网页行为进行编程

前端开发者的核心工作

  • 页面渲染
  • 用户体验
  • 性能优化

JavaScript基本介绍

JavaScript 诞生于 1995 年。布兰登·艾奇(Brendan Eich)开发。
JavaScript是一种轻量级、解释型的Web开发脚本语言。
JavaScript 能够改变 HTML 内容。
JavaScript 能够改变 HTML 属性。
JavaScript 能够改变 HTML 样式 (CSS)。
JavaScript 能够隐藏 HTML 元素。

document.getElementById("box").style.display="none";

JavaScript 能够显示 HTML 元素。

document.getElementById("box").style.display="block";

JavaScript 同时接受双引号和单引号

JavaScript应该有三个组成部分

核心(ECMAScript):描述了该语言的语法和基本对象(es5/es6)。

文档对象模型(DOM):描述处理网页内容的方法和接口。

浏览器对象模型(BOM):描述与浏览器进行交互的方法和接口。

JavaScript的使用

在 HTML 中,JavaScript 的代码必须位于 标签之间。
script标签可以位于HTML的多个位置:
可以位于 < head > 标签当中:

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script></script>
	</head>

也可以位于 < body > 标签里:

	<body>
		<script type="text/javascript"></script>
	</body>

或者放在body标签的后面:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
	<script></script>
</html>

甚至放在HTML标签的后面:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
	</body>
</html>
<script></script>

再或者直接写在行内(不推荐使用):

	<body>
		<button onclick="console.log('点击触发')">点击事件</button>
	</body>

但是我们更多使用的是外部引入的方式:

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="外部文件路径.js"></script>
	</head>

JavaScript里的变量

变量的概念:所谓变量,就是特定时间用于保存特定值的一个名字而已,并且初始化后可以再次改变的量。ECMAScript 的变量是松散类型的,所谓松散类型就是可以用来保存任何类型的数据。
声明(var):JavaScript里我们用var关键字来声明定义变量;

	<body>
		<script type="text/javascript">
			//var a = 10 ;
			//或者用逗号隔开进行多个变量的定义
			var a = 10 ,
				b = 12 ,
				c = 23;
		</script>
	</body>

变量命名规则

变量命名由字母、数字、下划线或$符号组成,但是不能以数字开头,不能以关键字命名(如:var var = 10 )。变量命名应尽量做到见名知义,常用的命名方法有驼峰命名法,匈牙利命名法。
匈牙利命名法:首字母为变量类型;如(var oBox,o表示object)
驼峰命名又分为大驼峰和小驼峰:
大驼峰命名:每一个单词首字母都大写(如:ClassName);
小驼峰命名:从第二个单词开始首字母大写(如:className);

附上一个方便的学习网站:https://www.w3school.com.cn/index.html
附上一个方便的查询网站:https://developer.mozilla.org/zh-CN/

你可能感兴趣的:(JavaScript,html)