4.2_WEB——前端语言三剑客（HTML、JS、CSS）
前言：本文只对三种前端常用的编辑于言 HTML、JS、CSS 的语法做最基础的描述。
一.HTML(Hyper Text Markup Language)
1.概念
- HTML的全称为超文本标记语言，是一种标记语言。它包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。
- 超文本是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。这些相互关联的信息媒体可能在同一文本中，也可能是其他文件，或是地理位置相距遥远的某台计算机上的文件。
- HTML是一种基础技术，常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面 。网页浏览器可以读取HTML文件，并将其渲染成可视化网页。HTML描述了一个网站的结构语义随着线索的呈现，使之成为一种标记语言而非编程语言。
2.特点
超文本标记语言文档制作不是很复杂，但功能强大，支持不同数据格式的文件镶入，这也是万维网（WWW）盛行的原因之一，其主要特点如下：
- 简易性：
- 超文本标记语言版本升级采用超集方式，从而更加灵活方便。
- 可扩展性：
超文本标记语言的广泛应用带来了加强功能，增加标识符等要求，超文本标记语言采取子类元素的方式，为系统扩展带来保证。
- 平台无关性：
虽然个人计算机大行其道，但使用MAC等其他机器的大有人在，超文本标记语言可以使用在广泛的平台上，这也是万维网（WWW）盛行的另一个原因。
- 通用性：
HTML是网络的通用语言，一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面，这些页面可以被网上任何其他人浏览到，无论使用的是什么类型的电脑或浏览器。
3.基本语法结构
标准的超文本标记语言文件都具有一个基本的整体结构，标记一般都是成对出现（部分标记除外例如：<br/> <img/>），即超文本标记语言文件的开头与结尾标志和超文本标记语言的头部与实体两大部分。这些成对出现的标签中，第一个标签是开始标签，第二个标签是结束标签。两个标签之间为元素的内容，有些标签没有内容，为空元素，如<img>有三个双标记符用于页面整体结构的确认。 
HTML代码的基本机构上图所示
：
骨架中的第一行,DTD（Document Type Definition，文本类型定义），必须出现在第一行。让浏览器知道是什么格式的文件 :
包裹着整个html代码 ：
包含着网页的头部内容 ：
包含着网页中显示的实际内容 1.)头部内容常用标签
头部中包含的标记是页面的标题、序言、说明等内容，它本身不作为内容来显示，但影响网页显示的效果。头部中最常用的标记符是标题标记符title和meta标记符，其中标题标记符用于定义网页的标题，它的内容显示在网页窗口的标题栏中，网页标题可被浏览器用做书签和收藏清单。
以下表格列出了 HTML head 常用元素：
| 标签 | 描述 |
|---|---|
| 定义了文档的信息 | |
| 定义了文档的标题 | |
| 定义了页面链接标签的默认链接地址 | |
| 定义了一个文档和外部资源之间的关系 | |
| 定义了HTML文档中的元数据 | |
2.)主体结构中常用标签
；网页中显示的实际内容均包含在这2个正文标记符之间。正文标记符又称为实体标记。
- 标题：总共有6个等级，定义方法如下
定义一级标题
定义二级标题
定义三级标题
定义四级标题
定义五级标题
定义六级标题
- 文本
定义文本
- 换行符
换行符
- img标签（image）
<body> <img src="3.png" alt="实例" title="测试" > <img src="2.png" alt="出错啦"> </body> src: 作用是引入图片的路径（图片存放路径必须是在html文件的存放路径下）
alt: 图片加载不出来时候的替换文本
width: 设置图片的宽度
height: 设置图片的高度
title：悬停提示。鼠标悬停时显示的文字提示
border：边框设置。HTML5 已废弃该属性
- 锚点 (anchor)
<body> <a href="7_标签跳转.html" target="_blank" >跳转相对路径文件</a> </body> - href: 英文hypertext reference （超文本引用）
- target：作用是是否在新的标签页打开链接，值一定是“_blank
二.CSS(Cascading Style Sheets)
1.概念
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
2.特点
总体来说，CSS具有以下特点：
（1）丰富的样式定义
CSS提供了丰富的文档样式外观，以及设置文本和背景属性的能力；允许为任何元素创建边框，以及元素边框与其他元素间的距离，以及元素边框与元素内容间的距离；允许随意改变文本的大小写方式、修饰方式以及其他页面效果。（
（2）易于使用和修改
CSS可以将样式定义在HTML元素的style属性中，也可以将其定义在HTML文档的header部分，也可以将样式声明在一个专门的CSS文件中，以供HTML页面引用。总之，CSS样式表可以将所有的样式声明统一存放，进行统一管理。另外，可以将相同样式的元素进行归类，使用同一个样式进行定义，也可以将某个样式应用到所有同名的HTML标签中，也可以将一个CSS样式指定到某个页面元素中。如果要修改样式，我们只需要在样式列表中找到相应的样式声明进行修改。
（3）多页面应用
CSS样式表可以单独存放在一个CSS文件中，这样我们就可以在多个页面中使用同一个CSS样式表。CSS样式表理论上不属于任何页面文件，在任何页面文件中都可以将其引用。这样就可以实现多个页面风格的统一。
（4）层叠
简单的说，层叠就是对一个元素多次设置同一个样式，这将使用最后一次设置的属性值。例如对一个站点中的多个页面使用了同一套CSS样式表，而某些页面中的某些元素想使用其他样式，就可以针对这些样式单独定义一个样式表应用到页面中。这些后来定义的样式将对前面的样式设置进行重写，在浏览器中看到的将是最后面设置的样式效果。
（5）页面压缩
在使用HTML定义页面效果的网站中，往往需要大量或重复的表格和font元素形成各种规格的文字样式，这样做的后果就是会产生大量的HTML标签，从而使页面文件的大小增加。而将样式的声明单独放到CSS样式表中，可以大大的减小页面的体积，这样在加载页面时使用的时间也会大大的减少。另外，CSS样式表的复用更大程序的缩减了页面的体积，减少下载的时间。
3.语言基础
1.）属性和属性值
a.属性
属性的名字是一个合法的标识符，它们是CSS语法中的关键字。一种属性规定了格式修饰的一个方面。例如：color是文本的颜色属性，而text-indent则规定了段落的缩进。
要掌握一个属性的用法，有六个方面需要了解。具体叙述如下：
①该属性的合法属性值（legal value）。显然段落缩进属性text-indent只能赋给一个表示长度的值，而表示背景图案的background．image属性则应该取一个表示图片位置链接的值或者是关键字none表示不用背景图案。
②该属性的默认值（initial value）。当在样式表单中没有规定该属性，而且该属性不能从它的父级元素那儿继承的时候，则浏览器将认为孩属性取它的默认值。
③该属性所适用的元素（Applies to）。有的属性只适用于某些个别的元素，比如white-space属性就只适用于块级元素。white-space属性可以取normal、pre和nowrap三个值。当取normal的时候，浏览器将忽略掉连续的空白字符，而只显示一个空白字符。当取pre的时候，则保留连续的空白字符。而取nowrap的时候，连续的空白字符被忽略，而且不自动换行。
④该属性的值是否被下一级继承（inherited）。
⑤如果该属性能取百分值（percentage），那么该百分值将如何解释。也就是百分值所相对的标准是什么。如margin属性可以取百分值，它是相对于margin所存元素的容器的宽度。
⑥该属性所属的媒介类型组（media groups）。
b.属性值
①整数和实数
这和普通意义上的整数和实数没有多大区别。在CSS中只能使用浮点小数，而不能像其他编程语言那样使用科学记数法表示实数，即1.2E3在CSS中将是不合法的。下面是几个正确的例子，整数：128、-313，实数：12.20、1415、-12.03。
②长度量
一个长度量由整数或实数加上相应的长度单位组成。长度量常用来对元素定位。而定位分为绝对定位和相对定位，因而长度单位也分为相对长度单位和绝对长度单位。
相对长度单位有：
em——当前字体的高度，也就是font.size属性的值；
ex——当前字体中小写字母x的高度；
Dx——一个像素的长度，其实际的长度由显示器的设置决定，比如在800木600的设置下，一个像素的长度就等于屏幕的宽度除以800。
另一一点值得注意的是，子级元素不继承父级元素的相对长度值，只继承它们的实际计算值。
③百分数量（percentages）
百分数量就是数字加上百分号。显然，百分数量总是相对的，所以和相对长度量一样，百分数量不被子级元素继承。
2.)选择器类型
CSS 选择器是一种用于匹配 HTML 文档中元素的模式，它指定了哪些 HTML 元素将被应用 CSS 样式规则。
例如，以下简单规则的选择器是H1，因此规则作用于文档中所有的H1元素：
H1{color:red}
CSS 选择器通过不同的方式来选择元素，包括根据元素名称、类名、ID、属性等，以及通过元素之间的关系来选择。
4.基本语法结构
1.)代码样式
a.)行内样式
行内样式：直接定义在 HTML 标签的 style 属性中
<p>你好</p> <!-- 行内样式，直接定义在 html 标签的style 属性中--> <p>你好 2</p> <!-- 放大字体--> <p>文字</p><!-- 配置多个 style 属性 --> b.)内嵌样式
在 HTML 头部（head 标签内）的 style 标签中定义 CSS 样式。写在外面
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style>/* 在 head 里面写 style 属性 */ div{/* 块状元素 */ background-color: blue;/* 背景色 */ width: 100px;/* 宽度 */ height: 100px;/* 高度 */ }</style> </head> <body> <div></div> //这里要运用 </body> </html> c.)外部样式
将 CSS 样式定义在一个 .css 格式的文件中，然后使用 HTML 的 link 标签将这个 .css 格式的样式文件应用到 HTML 文档中。
css 文件
div{/* 配置 div 标签属性*/ background: aquamarine; /* 配置 dev 块元素得颜色*/ } p{/* 配置 p 标签属性 */ color: red;/* 配置字体颜色 */ background: black;/* 配置字体背景颜色 */ } html 代码使用 link 标签引入
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="css.css"> <!-- 外部链接到 css.css 文件，使用 css 外部链接样式，相对路径，rel 声明这是一个样式表--> </head> <body> <div> <!-- 块元素--> <p>这是第一段落</p> <!-- 在块元素内写 p 标签，写内容--> <p>这是第二段落</p> <span>这是一个 span 标签</span></div> </body> </html> d.)样式优先级
行内样式 > 内嵌样式 > 外部样式
注意：尽量不要在同一个 Html 文件中使用
2.)css选择器
a.)后代选择器
它用于选择某个元素的所有特定后代元素。换句话说，它可以选择位于另一个元素内部的特定元素
向下继承选择
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> .c1 ul li{ /* 引用第一个 div 里面的 ul 下的所有 li*/ color: red; } .c2 ul li{ color: blue; } </style> </head> <body> <div> <!-- 这里要放不同的 div，在 div 里面写 class 类选择器 --> <ul >一号 <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div> <div> <ul>二号 <li>1</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div> </body> </html> b.)ID 选择器/类选择器
根据标签的 ID 属性或者 class 属性来匹配，ID 选择器的定义需要用到#，后面紧跟 ID 属性值，类选择器的定义需要用到一个英文的句号.，后面紧跟 class 属性的值。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> #d1{ /* 再前面使用#加名字来引用 id 选择器，并做背景色选择*/ background: aquamarine; } .c1{ /* 在前面使用.加名字来引用类选择器*/ background: burlywood; } </style> </head> <body> <div> <span>ID 选择器</span> <!-- 使用 id 选择器，将id 名设置为 d1--> <span>类选择器</span><!-- 使用 class 选择器，类选择器 --> </div> </body> </html> ID 选择器：
每个 ID 在页面中必须是唯一的。这意味着一个 ID 值在整个 HTML 文档中只能出现一次。ID 选择器使用井号（#）作为前缀，后面跟着 ID 的名称。
class 选择器：
class（类）可以多次使用在多个元素上。一个元素甚至可以同时拥有多个 class。class 选择器使用点号（.）作为前缀，后面跟着类的名称。
c.)伪类选择器
伪类选择器是一种特殊的选择器，可以用来选择处于特定状态的元素，例如未被访问的链接、已被访问的链接、鼠标悬停在上面的元素、活动元素和获得焦点的表单元素等。
:link 伪类选择器：访问之前状态
:visited 伪类选择器：访问之后状态
:hover 伪类选择器：选择鼠标悬停在上面的元素。
:active 伪类选择器：激活状态（鼠标按下未松开状态）
:focus 伪类选择器：选择获得焦点的元素，一般是表单元素，如 input 类
<!DOCTYPE html> <html > <head> <meta charset="UTF-8"> <title>伪类选择器</title> <style> /* 链接的默认样式（未被访问、未处于激活状态、未悬停） */ a:link { color: blue; /* 未访问链接的颜色 */ } /* 链接在鼠标悬停时的样式 */ a:hover { color: red; /* 悬停时链接的颜色 */ } /* 链接被激活时的样式（例如，当点击链接时） */ a:active { color: green; /* 激活时链接的颜色 */ } /* 链接被访问后的样式 */ a:visited { color: pink; /* 访问后链接的颜色 */ /* 注意：出于安全和隐私的考虑，某些样式更改可能不会被应用*/ } </style> </head> <body> <p>这是一个包含不同状态链接的示例：</p> <a href="http://www.baidu.com">点我点我</a> </body> </html> 3.）常用样式
字体样式
font-style 用于指定字体
三.JS(Java Script)
1.概念
JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。虽然它是作为开发Web页面的脚本语言而出名的，但是它也被用到了很多非浏览器环境中，JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。
2.特点
1.）组成
前端的组成：
HTML（结构层）：利用语义化标签搭建网页
CSS（样式层）：利用样式进行美化网页，进行网页布局
JavaScript（行为层）：可以给网页添加动态效果
JavaScript的组成：
JavaScript由三部分组成：ECMAScript、DOM、BOM
ECMAScript：是由欧洲计算机协会，大概每年六月中旬定制语法规范
DOM：即document object model，文档对象模型
BOM：即browser object model，浏览器对象模型
2.）功能
- 事件处理：
- JavaScript能够响应用户操作，如点击、滚动、键入等，使得网页可以交互式地响应用户输入。
- 操作DOM：
- JavaScript可以操作HTML和CSS，改变网页内容、结构和样式，实现动态的页面效果。
- 异步编程：
- 通过回调函数、Promises、async/await等机制，JavaScript能够执行非阻塞的异步编程，特别适合处理网络请求和文件操作。
- JSON处理：
- 作为网络传输中使用的主要数据格式，JavaScript原生支持JSON格式的解析和输出。
- 一等函数：
- JavaScript中的函数是“一等公民”，意味着它们可以像任何其他变量一样被传递和操作。
3.基本语法结构
js是一门脚本语言，他需要嵌套在网页中才能运行需要使用双闭合标签script，将js语法嵌套在网页中运行
script标签可以放在程序的任何地方，但是一般会放在程序的最下方。可以同时使用多个script标签
script标签内部，只能放JS语法。标签、样式等不能放在script标签内部
script标签有一个type属性，属性值为text/JavaScript。代表的是书写JS语法
1.）内置语法
内置函数：内置即浏览器自带的，函数即某个功能
1.1 alert 警告框
alert 即警告、警报的意思
alert是JS当中内置函数，他的主要作用是，在浏览器的正上方弹出一个警示框
<script type="text/javascript"> //内置函数alert alert("这是一个警示框"); alert('这是另一个警示框'); </script> 1.2 prompt 提示框
prompt 即提示、提示符的意思
prompt也是JS中的内置函数，主要作用是在浏览器的上方，弹出一个提示框
prompt可以在浏览器上方弹出一个提示框。用户是可以输入数据的。
<script> prompt("这是一个提示框"); prompt('这是另一个提示框'); </script> <script> var x = prompt("有几只鸭子在水面上"); // 提示输入 数字。假设输入 12 console.log("水面上有" + x +"只鸭子"); // 输出 水面上有12只鸭子 </script> 1.3 console 控制台
console即控制台的意思
在JS中，可以通过console对象的log方法在控制台中输出一些内容
<script> console.log("这是一条控制台信息"); console.log('这是另一条控制台信息',"而且还能写两条哦"); </script> 2.)字面量
字面量：就是某一个类型数据的一个固定数值；当看到这个固定数值的时候，就知道它是属于哪种类型的数据。
在JS世界当中，JS中的数据是有数据类型划分的。JS的数据类型一共有六种：五个基本数据类型和一个引用类型
五个基本的数据类型包括：
- string（字符串类型）：“你拍一，我拍一”
- Number(数字类型)：100、200、2.36
- Boolean（布尔类型）：true、false
- Undefined（未定义类型）：undefined
- Null（空对象类型）：null
一个引用类型包括：
Object（引用类型）：函数、数组、正则、DOM、BOM
注意：编程时，书写的数据必须是这六种数据类型当中的数值，如果不是程序就会报错，例如不加引号的字符串。
2.1特殊的数字类型字面量
2.1.1 科学计数法
概述：科学计数法，也是表示数字一种形式。代表的是某一个数字与10的N次幂的乘积.
console.log(3.14E2); //3.14乘以10的2次方 2.1.2 Infinity
Infinity即无穷的意思
概述：在JS当中，数字其实是有范围的。2-1075~21024（开区间）大小的数,如果开发中书写数字超出这个范围，可以利用特殊值Infinity进行表示。
- Infinity这个数字类型的特殊值，也有正负之分。
- 数字类型的特殊值Infinity（无穷大），也有正负之分。（代表这个数字超出JS数字范围）
- Infinity（无穷大）的首个英文字母，是大写的。
console.log(Infinity); // 输出 Infinity 2.1.3 NaN
NaN 英文全称【Not A Number】，它是Number（数字类型）中的一个特殊值。这个数值，一般是在数学计算不出结果的时候会出现的。
比如：在数学当中，数字零不能作为分母的。如果出现这种情况，别的语言可能崩掉
console.log(0/0); // 输出 数字类型特殊值NaN console.log(1/0); // 输出 数字类型特殊值Infinity console.log(0/0); 如果分子、分母同时为零。认为分母零（零），但是计算不出结果，只能返回一个数字类型特殊值NaN
console.log(1/0); 如果分子（不为零），分母为零。认为分母零（趋近于零的这样的一个数字），只能返回一个数字类型特殊值Infinity。
3.）变量
3.1 变量的使用
变量在使用的时候分为三步：声明、赋值和使用
1、声明：我们在使用变量之前，要通过关键字var进行声明一次
2、赋值：可以将任意类型的字面量数值、数字计算完结果，赋值给变量
3、使用：通过访问变量名字，获取到变量存储结果
var age; // 声明一个变量 age age = 10; // 给变量赋值 10 console.log(age); // 输出 变量age 的值 3.2 变量名的命名规则
- 可以是数字、英文字母、下划线、美元符号$
- 不能以数字开头
- 不能是关键字、保留字
3.3 变量使用注意事项
- 声明一个变量但是不赋值。默认初始值为为定义类型值undefined
- 一个变量在声明一次后，可以进行多次赋值。后者赋值的数据会覆盖前者赋值的数据
- 直接访问一个未声明的变量，会直接报错
4.）变量类型查询和转换
4.1 变量类型查询
在JS中，可以利用关键字typeof，它主要的作用是可以检测任意类型的字面量或者变量存储的数据为什么类型的数值。
使用的时候，关键字typeof + 空格 + 检测数据即可
4.2 变量类型转换
4.2.1 数字转换为字符串
在JS当中，可以通过连字符（+）将数字类型的数据转换为字符串。
如果语句当中没有出现字符串，这个加号就是数学的加法，可以进行数学的加法运算。
如果语句中出现了字符串，这个加号就不是数学的加法了，是所谓的连字符，可以将数据从左到右变成字符串
var age; // 声明一个变量 age age = 10; // 给变量赋值 10 console.log('我今年age岁了'); // 输出 我今年age岁了 console.log('我今年+age+岁了'); // 输出 我今年10岁了 4.2.2 字符串转换为数字
在JS当中，我们可以通过 parseInt 和 parseFloat 将字符串转换为数字
- 内置函数parseInt，可以将字符串中的数字形式字符串转换为数字（只能得到整数）
- 内置函数parseFloat，可以将字符串中的数字形式的字符串转换为数字（可以精确到小数部分）
- 二者都使用的是驼峰命名，即 parseInt的 I 和 parseFloat 的 F必须大写，否则会报错
- 在进行转换时，从左到右转换，如果数字形式字符，转换为数字，遇见了非数字形式的字符，后面的数据就不进行转换了
- parseInt和parseFloat的使用方法都是一模一样的，只是精确度不同
console.log(parseInt('我今年10岁了678')); // 输出 10 console.log(parseInt('我今年age岁了')); // 输出 NaN console.log(parseFloat('3.14和5谁大')); // 输出 3.14 console.log(parseInt('3.14和5谁大')); // 输出 3 5.) string类型参与计算
特别注意：加号，比较特殊。如果语句当中，出现字符串，加号所谓连字符。
字符串和加号一起使用（连字符）。将数据从左到右依次拼接，转换为字符串。
字符串和减、乘、除、取余数进行数学运算的时候。字符串需要“隐式转换”为数字参与。
| string类型 | 隐式转换为数字 |
|---|---|
| 空字符串 | 0 |
| 纯数字字符的字符串 | 隐式转换为对应的数字 |
| 非纯数字字符的字符串 | 隐式转换为NaN |
console.log(''-60); // 输出 -60 console.log('呵呵'-60); // 输出 NaN console.log('123呵呵456'-60); // 输出 NaN console.log('30'-60); // 输出 -30 6.）比较运算符
在JS语言当中也有所谓比较运算符（比较操作符）。比如：大于、小于、大于等于、小于等于等等。
比较运算符作用：进行数据对比，如果对比结果是真的，返回布尔值true，如果对比的结果为假的，返回布尔值false。
| > | 大于 |
|---|---|
| >= | 大于等于 |
| < | 小于 |
| <= | 小于等于 |
| == | 相等 |
| === | 全等（值和数据类型都等） |
| != | 不等 |
| !=== | 不全等 |
7.）Number类型的数值参与
正常的Number类型间的 加、减、乘、除、取余 计算都是正常的法计算即可。相等和全等返回的结果是true和false
6.1 Number类型的特殊值参与
- Infinity参与比较运算时，按正常计算即可，Infinity全等于其本身
- NaN，在JS当中，全部特殊值【数字类型：Infinity、NaN；未定义：undefined；空对象：null】当中，只有数字类型的特殊值NaN和自身比较的时候不等。其余的特殊值和自身比较的时候都是相等的。
- 数字类型的特殊值NaN参与比较运算：只有带！(不)，返回的是布尔值true，其余都是false。
6.2 其他类型数据参与（不包含字符串类型）
在JS当中，其他类型数据（布尔、未定义、空对象）也可以参与比较运算。
需要注意的是，其他类型的数据参与比较运算的时候，需要**‘隐式转换**’为数字参与比较运算。
6.3 字符串类型参与
字符串类型数据也可以参与比较运算。
6.3.1 其他类型数据（数字、布尔、未定义、空对象）和字符串进行对比。
–通过隐式转换为数字进行对比，隐式转换的值和上面数学计算的值相同
6.3.2 字符串和字符串进行对比。
通过ACSII进行对比。
注意：字符串和字符串进行对比的时候是通过ASCII进行对比。如果是字符串和字符串进行对比。是通过从左到右一个一个字符进行比较，直到比较除结果为止。
0~9<A-Z<a-z:这些字符从左到右依次变大。
8.）函数 function
function:函数、功能。
函数【function】，函数你可以理解为将某一个常用的功能进行封装。当你想使用这个功能的时候，可以选择调用、执行这个功能即可。
注意:JavaScript脚本语言当中，函数分为两种：一种关键字function定义函数、一种是表达式形式函数。
函数使用分为两部分：声明、调用
8.1 关键字形式函数
需要通过关键字 function 进行声明、定义
//声明部分
function fun(){ ....书写代码地方 } //调用部分 fun(); 8.2 表达式形式函数
将关键字function定义的函数赋值给变量形式。
var jch = function () { console.log("我爱你塞北的大雪呀"); } jch(); 
