JavaScript；
为什么要有JavaScript?
因为用户每一次操作都是要和服务器进行交互的，而当不小心进行了不如意的操作的时候
无法进行回退，使得用户要重新进行操作使得用户的体验性差。
是什么？
JavaScript是脚本语言，是网景公司开发的一个语言，是运行在浏览器的一个脚本语言，
只是借助Java的名字，而非Sun公司开发的。
这个语言最初的设计时为了解决用户注册的问题的。
作用；
通过JavaScript来···操作···HTML标签可以提高用户的体验性。
如；···因为在用户注册时，如果输入有误则需要全部重新输入，不利于用户的体验性
所以也可以通过JavaScript来对用户的输入做一个范围性的限制，
帮助用户避免输入有误。
◆注；可以通过正则表达式来设置
语法；/^正则&/i --- i 是不区分大小写
分类；
1.ECMA_JavaScript是一个JavaScript基础语法
2.BOM_JavaScript是一个面向浏览器的一个JavaScript脚本编程
3.DOM_JavaScript是一个面向页面（用户体验）的一个JavaScript脚本编程
★★★注；在JavaScript中的事件顶层对象是window
普通对象的顶层对象是Object
★重★重★注； 1.方法名不能是与关键字一样，如果没有反应则试下改下名字。
2. 注意大小写问题
----------------------------------------------ＪＳ—— 正则表达式 ---------------------------------------------------------------
JavaScript正则表达式；
javaScript的正则表达式和Java的正则表达式符号是通用
【基本所有的语言的正则表达式都是通用的】
JavaScirpt正则表达式语法；
/^正则$/ ^是一个开始标识符
$是一个结束标识符
并且要使用/ xx /
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■↓↓↓↓↓↓ＥＣＭＡ——ＪＳ↓↓↓↓↓↓↓↓■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
在HTML中定义JavaScript方式；
1.外部引入；在外部定义一个 .jsp 或 .js 后缀的文件，
在JS文件中写JavaScript的代码，如同CSS的外部引入
2.内部定义；在HTML文档中的<head></head>标签中使用
<script></script> 标签，在标签内部写JavaScript代码
----------------------------------------------------特点---------------------------------------------------------------
JavaScript特点；
1.弱类型的语言，对数据类型不敏感，【因为只有一个var关键字来定义数据】
2.解释型的语言，是直接在浏览器中运行的，
------- 而··不··需要像Java那样还需要进行编译，【所以是按照顺序运行的。】
3.跨平台，跨语言的一个脚本语言，【在PHP，C#，Java等都可以用】
4.运行在浏览器的语言，在HTML文本中定义或引用。
5.基于事件驱动的语言
6.是一个基于对象的语言
7.文件后缀是.js/.jsp
-----------------------------------------------------数据类型-------------------------------------------------------------
JavaScript数据类型； var a = 5;
只有一个〓【 var 】〓关键字来定义数据（变量）的类型，
通过数据（变量）的内容来判断是一个什么类型。
······所以是一个弱类型的语言。
JavaScript数据类型；
boolean ----- true | false
String ----- 字符串 | 字符
Number ----- 数字
undifined ----- 空 | null
Object ----- 自定义对象 | JavaScript提供的对象
◆注；在JavaScript中Number类型，如果要进行一个小数点的运算，
则需要进行转换，否则会默认是一个四舍五入的运算
因为在JavaScript没有浮点类型
〓注；A、【 0 】则是false
【 非0 】 则是 true 负数也是
B、【 null/空 】 则是 false
【 非空 】 则是 true
C、【 undifined 】则是false
【 非undifined 】 则是true
-------------------------------------------------类型转换----------------------------------------------------------------
因为在JavaScript没有浮点类型
类型转换；
1.parseFloat() 将Number类型的一个数值转换成一个小数点的值
2.parseInt() 可以将一个字符串转换成一个整数类型，
★注；只转换可以进行转换的··开始···数字字符串
--------------------------------------------------运算符-----------------------------------------------------------
JavaScript运算符；
算术运算符；+ - * / & ^ |
逻辑运算符；|| && ! 【在JavaScript中没有单 | & 】
比较运算符；> < >= <= !=
三目运算符；(表达式)? x:y;
-------------------------------------------------判断语句---------------------------------------------------------------
1.if
if---else
if---else if...
if---else if...---else
2.switch---case
在switch中的case可以使String，判断语句，number
▲ 注；如果在case中的返回是什么类型则在switch()中则写什么类型。
如；case是判断语句那么在switch()中则写布尔类型的值
---------------------------------------------------循环------------------------------------------------------------
1.while{}
2.do{ }while
3.for(){}
4.for--in
5.with(对象)
▲for--in就是在Java中的forEach，
在JavaScript中主要用于遍历对象和数组的，
1.遍历数组；
JavaScript中遍历数组是遍历出每一个元素的下标
2.遍历对象；
JavaScript中是遍历每一个对象的属性类型，
所以遍历对象时使用；对象[ x ]才可以获取到值
▲with(对象) 是一个预定义的，当需要调用N个这个对象方法时可以使用这个
----------------------------------------------函数和对象的定义--------------------------------------------------------------
在JavaScript中的···函数和对象···的定义是使用function()关键字的。
函数定义的方式；
1.function x(){} ----- 无参的
2.function x(a,b){} ----- 有参的
对象定义的方式；
1.function x(){} ---- 无参
2.function x(a,b){} ---- 有参的
3.var v = function (){} --- 可有参可无参
4.var v = new Object() --- 通过基类来定义，直接 v.属性 = 值 即可
5.var v = { : } --- 属性之间使用 , 隔开 属性赋值是 : 也是一个json格式
〓 注；对象和函数的定义方式类似，而是方法还是对象取决于如何调用
1.函数名() 这个是函数
2.new 函数名() 这个是对象
3.可以通过对象.[属性类型]; 获取到对象的属性值
◆◆◆注；在JavaScript中的形参是不用写var 否则会报错
在JavaScript中有this关键字
JavaScript_Function_Introduce；
在JavaScript中是···没有···函数重载的···也没有···可变形参的。
所以在JavaScript中定义重名的函数，后面的函数会覆盖前面的函数。
虽然JavaScript中没有可变形参，
·····但是提供了····arguments对象数组···来获取到传进来的形参个数
而且在JavaScript中的函数传入的实参个数和形参个数
不一样也不会报错
JavaScript常用的对象；
1.String ....
2.Number ....
3.Boolean ....
4.Date setInterval() setTimeOut()
5.Math round()....
6.数组；
定义方式；
var v = new Array(10);
var v = [xx,xx,xx];
特点；JavaScript的数组是可以存放任意的类型，而且长度是任意的，
即便指定了长度，可是如果是长度超过指定的长度，也不会报错，
而且会自动进行一个扩展。
prototype；
原形，是所有对象都会有的一个属性。
作用；是用于对对象的功能进行的一个扩展
如数组等
Array.prototype.扩展方法名 = function (){ }
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■↓↓↓↓↓↓ＢＯＭ——ＪＳ↓↓↓↓↓↓↓↓■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
BOM_JavaScript；
是什么？
Browser Object Model 是一个浏览器对象模型。
作用；
BOM是面向浏览器操作的。
如；用户点击某页面的某一处，就回退到上一个页面等........
BOM是根据对象进行操作的。
--------------------------------------------------ＢＯＭ的元素-------------------------------------------------------------
BOM中的元素；
1.弹出框（事件）
---alert() 弹出框（提示）
---confirm() 确认弹出框
---prompt() 输入弹出框
2.定时
id setInterval(x,time) === 过多长时间执行一次，执行N次，返回一个id值
clearInterveal(id) === 清除时间定时
id setTimeOut(x,time) === 过多次时间执行，只执行一次，返回一个id值
clearTimeOut(id) === 清除时间定时
3.history
---历史记录对象；
可以作为前进和后退，和记录
--- back() 上一条历史记录
--- forward() 进入上一条历史记录
=== go(num) 通过指定数值来说明进入的历史记录，负数为退，正数为进,
——————如果超过打开的页数则没有反应
4.navagator
---导航对象；
一般用于兼容性问题，
因为有一些浏览器的版本不支持某些HTML标签
---appVersion
5.location
---本地对象；
本地页面刷新，跳转等。。。。。。
---href= 指定地址
---reload() 刷新本页面
6.Screen
---屏幕对象
---availHeight 获取到屏幕的高度，不包含任务栏
---avaiWidth 获取到屏幕的宽度，不包含任务栏
---height 获取到屏幕的高度，包含任务栏
---width 获取到屏幕的宽度，包含任务栏
7.Domcument；
---是一个规范。
●●● BOM是根据以上的的元素和用户的操作，作用于浏览器的。
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■↓↓↓↓↓↓ＤＯＭ——ＪＳ↓↓↓↓↓↓↓↓■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
DOM_JavaScript；
是什么?
1.Document Object Model 文档对象模型。
2.通过操作HTML结构的过程就叫做DOM编程。
3.DOM是层次化结构的。
作用；
1.是作用于浏览器的页面上的，根据用户的操作，作用于浏览器页面。
2.DOM是根据事件进行操作的。
▲ DOM是操作HTML结构的一种思想、规范。
▲ DOM是一个层出化结构的规范，因此将HTML文档结构定义成一棵树，
而每一个元素（标签）都是这个DOM的节点
------------------------------------------------ＤＯＭ节点分类------------------------------------------------------------------
DOM节点分类；
Node 基类节点
|--- Element 元素节点 （标签）
|--- Comment 注释节点 （标签）
|--- Text 文本节点（内容）
|--- Attr 属性节点 （标签）
★★★注；空格换行也是一个元素
------------------------------------------------ＤＯＭ节点获取方法------------------------------------------------------------------
DOM获取节点的方法；
1.document.getElementById("id")
--- 获取到这个id的节点（标签）
2.document.getElementsByClassName("className")
--- 获取到所有这个class属性的节点（标签）【数组】
3.document.getElementsByName("name")
--- 获取到所有这个name属性的节点 【数组】
4.document.getElementsByTagName("TagName")
--- 获取到这个标签名的所有节点【数组】
5.document.all()
---获取到这个文档的所有节点【数组】
6.document.forms()
---获取到这个文档的所有form表单的所有节点【数组】
7.document.images()
---获取到这个文档的所有图片【数组】
------------------------------------------------ＤＯＭ节点关系------------------------------------------------------------------
DOM节点的关系；
1.父关系；
Node parentNode() --- 获取到父节点
2.兄弟关系；
Node nextSubling() --- 下一个兄弟节点
Node previousSubling() --- 上一个兄弟节点
3.子关系；
Node childNodes() --- 获取到所有的子节点 【数组】
Node firstChild() --- 第一个子节点
Node lastChild() --- 最后一个子节点
------------------------------------------------ＤＯＭ增删改------------------------------------------------------------------
Node .createElement("nodeName") ----- 创建节点
Node .appendChild() 添加子节点， ----- 是添加到最后一个的。
Node .setAttribute("Attr.name","price") ----- 设置属性
Node .removeChild(“node”) ----- 删除节点
------------------------------------------------ＤＯＭ其他方法------------------------------------------------------------------
1.Node nodeName() ----- 节点名称
2.Node nodeType() ----- 节点类型 【数字】
3.Node nodeValue() ----- 节点的值
Node .value 获取到节点的文本内容
Node .innerHTML 设置节点的文本内容
给事件添加函数名，可以使用this代表当前
原文：https://www.cnblogs.com/-levi/p/11222322.html