JavaScript基础知识整理

3.JavaScript

指定了网页的行为

特点

• 脚本语言，无需编译
• 基于对象，弱类型
• 交互性，可以与用户进行动态交互
• 安全性，只能在浏览器内运行
• 跨平台，只要有浏览器即可，与平台无关

引入js

• 通过script标签引入js
• 引入外部的js文件

js语法

• 注释：// /**/

• 基本数据类型

  • 数值类型number
  • 字符串类型string
  • 布尔类型boolean
  • undefined未定义
  • null，空

• 变量的定义

  • 所有变量都是通过var关键字定义

• 运算符

  • 比较运算符

    • ==：比较时如果两端数据类型不同，先转换数据类型再比较
    • ===：比较时如果两端数据类型不同，直接返回false

  • typeof

    • 返回变量的数据类型

  • delete

    • 删除数组的元素或者对象的属性

• 语句

  • 条件语句：if…else…
  • 循环语句：while、for，但是不支持增强for循环

• 函数

  • function 函数名(形参列表){函数体}

• 数组

  • 创建

    • new Array(10)//长度为10的空数组
    • var arr = [123,“abc”,true]//指定初始值

  • 注意

    • 数组的元素类型不限
    • 数组的长度可以任意改变
    • 数组的元素没有值，则为undefined

• API

  • String

    • match(regexp)//返回匹配正则的值
    • replace(regexp,replaceStr)//根据正则匹配并替换
    • search(regexp)//查找第一次匹配正则的位置

  • RegExp(正则)

    • 创建

      • var reg1 = new RegExp(“java”,“ig”)
      • var reg2 = /java/ig

    • 标识符

      • i：忽略大小写
      • g：全局查找
      • ^：从开头匹配正则
      • $：以正则结尾

    • test(str)//检查字符串是否匹配正则

  • Array

    • sort()//字典排序

  • Date

    • 创建

      • var date1 = new Date()//当前时间
      • var date2 = new Date(年，月，日，时，分，秒)//指定时间

  • Math

    • 无需创建，直接调用方法
    • ceil()//向上取整
    • floor()//向下取整
    • round()//四舍五入
    • random()//生成0-1之间的随机数

  • 全局对象

    • isNaN(xxx)//判断是否为非数字
    • eval(stringCode)//将字符串的代码当作代码执行

• 自定义对象

  • 对象的定义

    • var person = {
      “name”:“zhangsan”,
      “age”:18,
      …
      }

  • 对象中取值

    • person.name
    • person[“name”]

DHTML

• 动态的html，结合了html、css、js

• BOM

  • 浏览器对象模型

  • window对象

    • 全局对象，可以之间调用其方法

    • 事件

      • onclick：点击事件
      • onfocus：获得焦点事件
      • onblur：失去焦点事件
      • onload：文档就绪事件

    • 方法

      • alert()：弹出提示框
      • confirm()：弹出确认框，返回boolean

• DOM

  • 文档对象模型

    • 获取元素

      • getElementById()：根据id获取元素
      • getElementsByName()：根据name属性获取元素，返回数组
      • getElementsByTagName()：根据元素名获取元素，返回数组
      • value属性：获取或者设置value属性值
      • innerHTML：获取或者设置元素的html内容

    • 元素的增删改

      • createElement(“div”)：创建一个元素
      • appendChild(Ele)：追加子元素
      • removeChild(Ele)：删除子元素
      • replaceChild(newEle,oldEle)：替换子元素
      • insertBefore(newEle,oldEle)：插入子元素
      • cloneNode([boolean])：克隆元素