JavaScript

JavaScript：
概念：一门客户端脚本语言。运行在客户端浏览器中，每一个浏览器都有JavaScript的解析引擎。脚本语言：不需要编译，直接就可以被浏览器解析执行。
功能：可以来增强用户和HTML页面的交互过程，可以来控制HTML元素，让页面有一些动态效果，增强用户体验
JavaScript=ECMAScript+JavaScript自己特有的东西(BOM+DOM)

ECMAScript：客户端脚本语言的标准

1. 基本语法
   与HTML结合的方式：内部JS直接写在HTML文件呢，外部JS用src建立连接引入外部文件
2. 注释
   单行注释：//注释内容；多行注释：/注释内容/
3. 数据类型
   原始数据类型(基本数据类型)：number：数字 string：字符串 boolean：true和false null：一个对象为空的占位符 undefined：未定义
   引用数据类型：对象
4. 变量
   变量：一小块存储数据的内存空间
   语法：var 变量名=初始化值;使用var则变量变为局部变量，不用则变为全局变量
5. 运算符
   不用于Java的：===(全等于) 比较之前先判断类型，如果类型不相等直接返回false
   三元运算符：语法：表达式?值1:值2;如果是true则取值1，false则取值2

基本对象：

• Function对象：函数（方法）对象
  创建：var fun=new Function(形式参数列表,方法体);
  function 方法名称(形式参数列表){ 方法体 }
  var 方法名=Function(形式参数列表){ 方法体 }
  属性：length属性表示形参的个数
  特点：方法定义时，形参的类型不用写，返回值类型也不写；方法是一个对象，定义名称相同的方法会覆盖；在js中，方法调用与方法名称有关，和参数列表无关；方法声明中有一个隐藏的内置对象arguments封装所有的实际参数
  调用：方法名称(实际参数列表)

• Array对象：数组对象
  创建：var arr=new Array(元素列表);
  var arr=new Array(默认长度);
  var arr=[元素列表];
  方法：join()：将数组中的元素按照指定的分隔符拼接为字符串
  push()：向数组的末尾添加一个或更多元素，并返回新得长度
  属性：length表示数组的长度
  特点：js中，数组元素的类型可变的，长度可变的

• Date对象
  创建：var date=new Date();
  方法：toLocaleString()：返回当前date对象对应的时间本地字符串格式；getTime()：获取毫秒值

• Math对象
  创建：Math对象不用创建可以直接使用 如：Math.方法名();
  方法：random()：返回0~1之间的随机数，含0不含1
  ceil(x)：对数进行向上舍入
  floor(x)：对数进行向下舍入
  round(x)：把数四舍五入为最近的整数
  属性：PI：圆周率

• RegExp：正则表达式对象
  正则表达式：定义字符串的组成规则
  单个字符：[ ] 如[a] [ab] [a-zA-Z0-9_]
  特殊符号代表特殊含义的单个字符：\d：单个数字字符[0-9] \w：单个单词字符[a-zA-A0-9_]
  量词符号：?：表示出现0次或1次 *：表示0次或多次 +：出现1次或多次 {m,n}：表示数量m<=数量<=n
  开始结束符号：^：开始 $：结束
  正则对象：
  创建：var reg=new RegExp(“正则表达式”);
  var reg=/正则表达式/;
  方法：test(参数) 验证指定的字符串是否符合正则定义的规范

• Global
  特点：全局对象，这个Global中封装的方法不需要对象就可以直接调用。方法名();
  方法：encodeURL():URL编码
  decodeURL():URL解码
  encodeURLComponent():URL编码，编码的字符更多
  decodeURLComponent():URL解码
  parseInt():逐一判断每一个字符是否是数字，直到不是数字为止，将是数字的返回为number
  isNaN():判断一个值是否是NaN
  eval():将JavaScript字符串，把他作为脚本代码来执行

BOM：Browser Object Model浏览器对象模型，将浏览器各个组成部分封装成对象
组成：
Window：窗口对象
属性：
获取其他BOM对象：history，location，Navigator，Screen
获取DOM对象：document
方法：

• 与弹出框有关的方法：

  1.alert()显示带有一段消息和一个确认按钮的警告框
  2.confirm()显示带有一段消息以及确认按钮和取消按钮的对话框 按确定返回true，取消返回false
  3.prompt()显示可提示用户输入的对话框 返回值：获取用户输入的值
  特点：Window对象不需要创建可以直接使用，window引用可以省略

• 与开发关闭浏览器有关的方法：

  close()关闭浏览器窗口
  open()打开一个新的浏览器窗口，会返回一个新的window对象

• 与定时器有关的方式：
  setTimeout() 在指定的毫秒值后执行指定的函数或语句，只会执行一次；参数：1.js代码或者方法对象；2.毫秒值；返回值：唯一表示用于取消
  clearTimeout() 取消由setTimeout()方法设置的timeout
  setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式
  clearInterval() 取消由setInterval()设置的timeout

Navigator：浏览器对象
Screen：显示器屏幕对象
History：历史记录对象

• 创建（获取）：window.history或直接使用history

• 方法：
  back()加载history列表中的前一个URL
  forward()加载history列表中的下一个URL
  go(参数)加载history列表中的某个具体页面 参数表示几个单位

• 属性：length 返回当前窗口历史列表中的URL数量

Location：地址栏对象

• 创建（获取）：window.location或直接使用location
• 方法：
  reload():重新加载当前文档，刷新
• 属性：
  href：设置或返回完整的URL

DOM：Document Object Model 文档对象模型，控制HTML文档的内容
代码：获取页面标签(元素)对象 Element
document.getElementById(“id值”)：通过元素的id获取元素对象
可以通过对象 修改属性 修改标签体内容

核心DOM模型：

• Document：文档对象

  • 创建（获取）：在HTML DOM模型中可以使用window对象获取
  • 方法：
    • 获取Element对象：
      getElementById()：根据id属性值获取元素对象。id属性值一般唯一
      getElementByTagName()：根据元素名称获取元素对象们。返回一个数组
      getElementByClassName()：根据Class属性值获取元素对象们。
      getElementByName()：根据name属性值获取元素对象们。
    • 创建其他DOM对象：
      createAttribute(name)
      createComment()
      createElement()
      createTextNode()

• Element：元素对象

  • 获取（创建）：通过Document来创建或获取
  • 方法：
    removeAttribute()删除属性
    setAttribute()设置属性

• Node：节点对象，其他5个的父对象

• 特点：所有的dom对象都可以被认为是一个节点

  • 方法：
    • appendChild()：向节点的子节点列表的结尾添加新的子节点
    • removeChild()：删除（并返回）当前节点的指定子节点
    • replaceChild()：用新节点替换一个子节点
  • 属性：
    • parentNode 返回节点的父节点

HTML DOM：

• 标签体的设置和获取：innerHTML
• 使用html元素对象的属性
• 控制样式

事件：

• 功能：某些组件被执行了某些操作后，触发某些代码的执行

• 绑定事件：

   1.直接在HTML标签上，指定事件的属性（操作），属性值就是js代码
   2.通过js获取元素对象，指定事件属性，设置一个函数
  

• 常用事件：

• 点击事件：

   onclick：单击事件
   ondblclick：双击事件
  

• 焦点事件

   onblur：失去焦点
   onfocus:元素获得焦点。
  

• 加载事件：

   onload：一张页面或一幅图像完成加载。
  

• 鼠标事件：

   onmousedown	鼠标按钮被按下。定义方法时定义一个形参，接受event对象
   onmouseup	鼠标按键被松开。
   onmousemove 鼠标被移动。
   onmouseover 鼠标移到某元素之上。
   onmouseout 鼠标从某元素移开。
  

• 键盘事件：

   onkeydown	某个键盘按键被按下。	
   onkeyup		某个键盘按键被松开。
   onkeypress	某个键盘按键被按下并松开。
  

• 选择和改变

   onchange 域的内容被改变。
   onselect 文本被选中。
  

• 表单事件：

   onsubmit	确认按钮被点击。
   onreset	重置按钮被点击。