mirror of
https://github.com/Estom/notes.git
synced 2026-03-23 21:50:20 +08:00
115 lines
1.4 KiB
Markdown
115 lines
1.4 KiB
Markdown
## 1 功能
|
||
|
||
> jquery是js的一个框架。目的是对js的编程方式进行封装，提供了新的编程方法。简化过程。
|
||
> 主要功能包括以下五个部分。非常重要和关键。
|
||
|
||
|
||
1. HTML元素选取
|
||
2. HTML元素操作：HTML和CSS、HTML DOM 遍历和修改
|
||
3. HTML事件处理：
|
||
4. JS特效动画
|
||
5. AJAX异步请求
|
||
|
||
## 2 引用
|
||
|
||
|
||
### 使用本地jquery
|
||
```
|
||
<head>
|
||
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
|
||
</script>
|
||
</head>
|
||
```
|
||
### 使用CDN
|
||
|
||
```
|
||
<head>
|
||
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
|
||
</script>
|
||
</head>
|
||
```
|
||
## 3 基础选择器
|
||
|
||
### 元素选择器
|
||
|
||
```
|
||
$("p")
|
||
```
|
||
|
||
### #id选择器
|
||
|
||
```
|
||
$("#test")
|
||
```
|
||
|
||
### .class 选择器
|
||
|
||
```
|
||
$(".test")
|
||
```
|
||
|
||
### 属性选择器
|
||
|
||
```
|
||
$("[href]")
|
||
```
|
||
|
||
### 特殊选择器
|
||
|
||
```
|
||
$("*") 选取所有元素
|
||
$(this) 选取当前 HTML 元素
|
||
```
|
||
|
||
### 组合选择器
|
||
|
||
```
|
||
$("selector1,selector2,...")选取多个选择器指定的元素
|
||
```
|
||
|
||
## 4 层次选择器
|
||
|
||
### 后代选择器
|
||
|
||
* 可能是子代也可能是子代的子代
|
||
```
|
||
$("ancestor descendant")
|
||
```
|
||
### 子代选择器
|
||
|
||
* 直接后代
|
||
|
||
```
|
||
$("parent>child")
|
||
```
|
||
|
||
### 相邻选择器
|
||
* 同级元素的下一个
|
||
```
|
||
$("prev+next")
|
||
```
|
||
|
||
### 同级选择器
|
||
|
||
* 所有同级元素
|
||
|
||
```
|
||
$("prev-siblings")
|
||
```
|
||
|
||
## 5 表单选择器
|
||
|
||
|
||
表单
|
||
```
|
||
:input
|
||
:text
|
||
:password
|
||
:radio
|
||
:checkbox
|
||
:submit
|
||
:image
|
||
:reset
|
||
:button
|
||
:file
|
||
``` |