# JS_JQ常用操作

**Repository Path**: weimomolin/js-common-operations

## Basic Information

- **Project Name**: JS_JQ常用操作
- **Description**: JS_JQ的一些常用操作记录
- **Primary Language**: Unknown
- **License**: MulanPSL-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-09-05
- **Last Updated**: 2023-09-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: JavaScript, jQuery

## README

# JS_JQ常用操作

#### 介绍
JS_JQ的一些常用操作记录


#### JS解释：
javascript 由web浏览器解析和执行，弱类型的脚本语言

#### JS组成部分：
  1、ECMAScript 核心语法部分
  2、DOM 文档对象模型 主要操作的内容页面的节点元素
  3、BOM 浏览器对象模型

#### JS的引入方式：
  1、直接使用script来写代码
  2、用script标签 src进行引入

1、ECMAScript核心 不同的版本
  2015年之前的版本：ES5
  ES6,ES7,ES8....ES14

#### DOM元素节点操作
##### 获取元素
    直接获取元素 id class 标签名称 querySelector querySelectorAll
    间接获取元素 前一个 后一个 子元素 父元素
    对元素进行操作 追加 删除

##### 操作文本内容 innerHTML innerText
    获取
    修改

##### 操作样式
    style.color
    className = 'test1 test2'

##### 操作属性
    获取属性 getAttribute 
    修改属性 setAttribute
    删除属性 removeAttribute

##### h5专门提供一个自定义属性方法 dataset
    规则：data-自定义属性

##### 盒模型
    宽度和高度，边距，边框，滚动条属性值，鼠标移动的坐标

##### 事件
###### 绑定事件

      1、通过获取元素，给元素绑定事件

      2、直接在元素身上，用onclick直接绑定事件

      3、给一个元素绑定多个事件需要用 监听：addEventListener 进行重复绑定事件

###### 事件种类

###### 事件冒泡和捕获

      冒泡：事件触发顺序，从里到外

      捕获：事件触发顺序，从外到里

      阻止冒泡和捕获：stopPropagation()

#### DOM和BOM
DOM 文档对象模型 -> 对页面进行操作
BOM 浏览器对象模型 -> 对浏览器窗口进行操作

在整个JS当中最大的对象 Window

#### 本地存储 相当于是页面的缓存

localStorage：永久存储，只要你不清除掉，他就一直存在

sessionStorage：关闭掉浏览器就清空

这两个，方法用的都是一样的。


#### 使用场景：app当中，微信小程序里面，网页

cookie 存放在客户端本地 基于浏览器进行存储

局限：受域名、文件夹路径、时间


#### jquery 是JS的一个插件库

作用：可以简化js方法，方法名长度，方法使用便捷度


```
JS获取元素
document.getElementById('demo')

jquery获取元素
$('#demo')
```

#### 思路步骤

  1、获取到要操作的dom元素

  2、如果需要给元素增加额外的自定义属性，那么就需要去初始化一下

  3、给获取到dom元素做绑定事件

  4、实现你需要的逻辑效果

#### JS内置对象

  Date 日期对象

  Math 数学对象

  Number 数值对象

  String

  Array -> object

  正则

  Object -> 底层对象

  NaN 特殊的值 不是一个数字

  parseInt("hello") -> NaN

  正则表达式：可以用于在字符串中进行格式化匹配


  网络请求：http://localhost/demo/8/
  本地协议：file:///Users/Sites/localhost/demo/8/index.html

#### 原型和原型链
##### 原型的作用：
      prototype -> Object对象
      可以拓展对象的属性和方法
      [] 数组
      {} 对象    
##### 原型链：可以去寻找 对象的父类(上一级)

    
#### Ajax 
一个异步请求的对象

##### 什么是同步请求 什么是异步请求

同步请求：用户发出去请求之后，只能够等待服务器返回结果，才能下一步操作，没返回结果只能一直等待

异步请求：用户通过ajax对象发请求出去，用户不需要等待服务器返回结果，可以继续下一步操作，服务器什么时候处理完，什么时候在返回就可以了

同步请求
  优点：相应效率是最高，可以在第一时间就拿到数据
  缺点：需要等待，如果服务器无相应，那么这个请求就会卡死

异步请求
  优点：不需要等待，什么时候有数据返回就可以，用户体验好
  缺点：不会在第一时间拿到最真实数据，有可能被处理过，在返回的