jQuery基础&选择器
jQuery基础&选择器
一、概述
-
jquery是js的框架
-
jquery和js的相互转换？ js转换为jquery : $(js对象) jquery转换为js : jquery对象[0] / jquery对象.get(0)
js和jquery对象的方法是不通用的！！！ -
jquery如何获取/设置值 ： .val(内容)
-
jquery如何获取/设置内容： .html(内容) .text(内容)
-
jquery操作属性 ： attr("属性名") attr("属性名","属性值”) removeAttr("属性名")
-
jquery如何操作样式： css("样式名") css("样式名","样式值")
-
jquery的选择器：比js更方便的选择标签
基本选择器、层次选择器、过滤器、表单选择器
二、js对象和jquery对象的相互转换
js对象和jquery对象是不同的，使用不同的属性和方法；但是他们又是可以相互转换的！！！
- js对象转换为jquery对象
$(js对象) - jquery对象转换为js对象
jquery对象[0] jquery对象.get(0)
三、jquery的几种用法
1、获取/设置值的用法
val(): 获取value值
val(内容)：设置value值
2、使用jquery获取/设置标签内容的值
html(): 获取内容值,包含标签
html(内容)：设置内容值
text(): 获取内容值，不包含标签
text(内容)：设置内容值
3、操作标签属性
1、获取属性内容 attr("属性名")：
2、设置属性 attr("属性名","属性值")：
3、设置多个属性：attr({
"属性名":"属性值",
"属性名1":"属性值1",
"属性名2":"属性值2"
})
4、移除属性 removeAttr("属性名")：
控制div块的显示和隐藏
python
java
html
4、操作css样式
.css("样式名"); 获取某个样式的值
.css("样式名","值"); 设置某个样式的
图片的展示
python
java
html
图片展示
四、jquery选择器
1、基本选择器
基本选择器包括标签选择器、类选择器、ID选择器、并集选择器、交集选择器和全局选择器
2、层次选择器
层次选择器
我是id="div1"的div
我是id="p1"的p
我是id="p2"的p
我是id="p3"的p
我是id="p4"的p
我是id="div2"的div
我是id="p5"的p
3、过滤选择器
过滤选择器主要是通过特定的过滤规则来筛选出所需的DOM元素，过滤规则与CSS中的伪类选择器语法 相同，都以一个 :冒号开头。
按照不同的过滤规则，过滤选择器可以分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤 和表单对象属性过滤选择器。
过滤选择器
- 西游记
- 水浒传
- 红楼梦
- 三国演义
案例：控制灯泡
五、文档处理
六、遍历
1
- 西游记
- 水浒传
- 红楼梦
- 三国演义
七、GET 和 POST 方法的区别
1、发送的数据数量
在 GET 中，只能发送有限数量的数据，因为数据是在 URL 中发送的。
在 POST 中，可以发送大量的数据，因为数据是在正文主体中发送的。
2、安全性
GET 方法发送的数据不受保护，因为数据在 URL 栏中公开，这增加了漏洞和黑客攻击的风险。
POST 方法发送的数据是安全的，因为数据未在 URL 栏中公开，还可以在其中使用多种编码技术，这使其具有弹性。
3、加入书签中
GET 查询的结果可以加入书签中，因为它以 URL 的形式存在；而 POST 查询的结果无法加入书签中。
4、编码
在表单中使用 GET 方法时，数据类型中只接受 ASCII 字符。
在表单提交时，POST 方法不绑定表单数据类型，并允许二进制和 ASCII 字符。
5、可变大小
GET 方法中的可变大小约为 2000 个字符。
POST 方法最多允许 8 Mb 的可变大小。
6、缓存
GET 方法的数据是可缓存的，而 POST 方法的数据是无法缓存的。
7、主要作用
GET 方法主要用于获取信息。而 POST 方法主要用于更新数据。
八、jquery-Ajax
九、form表单序列化
1.serialize()方法
格式：var data = $("#form").serialize();
功能：将表单内容序列化成一个字符串。
这样在ajax提交表单数据时，就不用一一列举出每一个参数。只需将data参数设置为 $("#form").serialize() 即可。
2.serializeArray()方法
格式：var jsonData = $("#form").serializeArray();
功能：将页面表单序列化成一个JSON结构的对象。注意不是JSON字符串。
比如，[{"name":"lihui", "age":"20"},{...}] 获取数据为 jsonData[0].name
表单序列化参考：
原文：https://www.cnblogs.com/52yu/p/14965510.html