引入方式

1. 直接用标签引入

<script></script>

2. 使用js文件引入

<script src="文件路径"></script>

基础语法

1. 注释

// 单行注释
或者
/*
多行注释
*/

2. 语句必须以分号结束
3. var 声明变量的关键字 变量名 = “值” ，数字、字母、下划线、不能以数字开头 ， $ 也可以做变量
4. 字符串常用方法

.length # 返回长度
.trim() # 移除空白
.trimLeft() # 移除左边空白
.trimRight() # 移除右边空白
.charAt(n) # 返回第n个字符
.concat(Value,.....) # 拼接
.indexOf(substring,start) # 子序列位置
.substring(from,to) # 根据索引获取子序列
.slice(start,end) # 切片
.toLowerCase() # 小写
.toUpperCase() # 大写
.split(delimiter, limit) # 分割

5. 数组

var a1 = [1,2,3];
a1[0] 
结果为 1


数组常用方法
.length # 数组 大小
.push(ele) # 尾部追加元素
.pop() # 获取 尾部的元素
.unshift(ele) # 头部插入元素
.shift() # 头部移除元素
.slice(start, end) # 切片
.reverse() # 翻转
.join() # 将数组连接成字符串
.concat(val,...) # 连接数组
.sort() # 排序

6. 控制语句

if (条件){
  语句;
}
else{
语句;
}

switch(值){
  case 1:
      语句；break;
  case 2:
      语句; break;
  ....
  default: # 都不满足时执行
      语句；
}


for（var i=0；i< 条件；i++）{
  要执行的语句；
}

while (条件){
语句；
}

# 三元运算
var a = 10;
var b = 21;
var c = a < b ? a : b;

7. 函数

函数定义
function 函数名(参数){
    语句
}


函数调用
函数名(参数);

8. 内置函数

var a = new Array(11,22,33) # 这样就可以生成一个数组列表

8.1 数据类型
Number 数字对象
String 字符串对象
Boolean 布尔值对象

8.2 组合对象
Array 数组对象
Math 数学对象
Date 日期对象

8.3 高级对象

Oberject 自定义对象
Error 错误对象
Function 函数对象
RegExp 正则表达式对象
Global 全局对象

---

BOM

9.1 window 对象：
window.innerWidth # 获取浏览器宽度
9.2 navigator 对象：
navigator.appName # 获取浏览器名字
9.3 screen 对象：
screen.availHeight # 可用屏幕高度
9.4 history 对象:
history.forward() # 前进一页
history.back() # 后退一页
9.5 location 对象
location.href # 获取当前网址
location.href = "url" # 跳转网址
location.reload() # 刷新网址

弹出框

1. 警告框
   alert()

2. 确定框
   confirm() # 有个返回值

3. 提示框（输入框）
   prompt()

计时相关

1. setTimeout(要做的事)

var t = setTimeout(alert("弹出框"), 500) # 后面的值是毫秒单位 t为计时器的序号

2. clearTimeout(t) # 清除上面指定的计时器

3. setInterval 和 clearInterval 每隔多少秒做一件事

---

DOM

对标签进行操作

JS操作DOM

1. 直接查找

document.getElementByID() #  通过ID查找
document.getElementsByClassName() # 通过class名查找
document.getElementsByTagName() # 通过标签名查找

2. 间接查找

标签.parentElement #  查找父级标签
标签.children # 查找所有子标签
标签.firstElementChild # 查找第一个子标签
标签.lastElementChild # 查找最后一个子标签
标签.previousElementSibling # 查找 上一个兄弟标签
标签.nextElementsibling # 下一个兄弟标签

3. 创建 标签

createElement("标签名")

4. 添加标签

appendChild("标签名") # 在内部最后添加
insertBefore(要插入的标签，那个标签的位置) # 在内部的某个标签的前面插入

5. 属性

（内置属性）
.属性名 = “属性值”

自定义属性使用
.setAttribute()
.getAttribute()

删除属性
.removeAttribute()

6. 文本操作

.innerText  # 获取内部内容
.innerText="新内容" # 设置文本内容标签也会受影响

.innerHTML # 连同标签一起获取
.innerHTML = “新内容”# 更改标签内部内容