jqueryclass点击_jQuery和DOM操作Jquery的安装和使⽤
安装：
下载JQuery⽂件并把⽂件放到web项⽬中
使⽤：
直接引⼊jQuery的核⼼JS⽂件
注意：
（1）引⼊jQuery的script标签可以放在推荐放在body标签后
（2）如果script标签设置了src属性，则在script双标签中写的js代码⽆效
4.常⽤操作：
5.DOM对象与jQuery对象之间的相互转换：
（1）DOM ===>
===> jQuery
在DOM对象外⾯包装JQery $(dom对象)
===> DOM
（2）JQuery ===>
JQuery包装集取下标 JQuery包装及对象[0]
JQuery中的each()遍历函数：
each(fucntion):
jquery是什么选择器
this：谁调⽤函数，this指代谁
jquery和js获取节点的区别
Js：如果节点不存在返回null
Js：
jQuery：如果节点不存在返回空包装集对象
jQuery：
所以判断jQuery对象是否存在需要⽤到length
JQuery选择器
基础选择器Basics（掌握即可）
举例：假设body中有这些元素
⽤基础选择器依次对其操作
Id选择器 $("#id属性值")
类选择器 $(".class属性值")
元素选择器 $("元素名/标签名")
选择所有选择器 $("*")
组合选择器 $("选择器1，选择器2...")
层次选择器
举例：假设body中有这些元素
⽤层次选择器依次对其操作
后代选择器 ncestor descendant、
⼦代选择器 parent>child
相邻选择器 prev + next
同辈选择器 prev ~ sibling
相邻选择器是选择与当前元素同级的下⼀个相邻元素
同辈选择器是选择与当前元素同级的后⾯的左右元素
其他选择器
表单选择器
过滤选择器
$(":input") 选择所有的表单元素 （⽂本框、密码框、下拉框、⽂本域等....）$(":input") 选择所有input标签元素
$(":checked") 选择所有选中状态的元素（单选框和复选框）
$(":checkbox:checked") 选择所有复选框被选中的元素
$(":checkbox:checked:gt(0)") 选择下标⼤于指定值的元素
$(":checkbox:checked:eq(0)") 匹配被选中的选择的指定下表元素$(":checkbox:checked").eq(1) 同上
$(":odd") 选择所有基数下标的元素
$(":even") 选择所有偶数下标的元素
属性选择器
$(“[属性名]”) 选择所有设置过指定属性的元素
$(“[属性名=属性值]”) 选择属性名等于指定值的元素
jQuery的DOM操作
操作元素的属性
假设body中有这些元素
<1>获取属性
固有属性：元素本⾝就有的属性
⾃定义属性:
返回值是boolean类型的属性:
未设置过的checked属性:
<2>设置属性
固有属性：元素本⾝就有的属性
⾃定义属性:
返回值是boolean类型的属性:
<3>移除属性
区别
1、固有属性：attr()和prop()都可使⽤
2、⾃定义属性：attr()可⽤，prop()不可⽤
3、返回值是boolean的属性：
attr()：如果设置过，则返回具体值，若未设置过，返回undefined
prop()：返回true和false
返回值是boolean类型的属性:
checked（单选和复选选中状态）、selected（下拉框选中状态）、disabled（禁⽤）总结：
返回值是boolean类型的属性，使⽤prop()；其他的属性使⽤attr()
操作元素的样式
（1）⽅法
（2）实例
假设元素和样式为以下
attr(“class”) 获取 class 属性的值，即样式名称
attr(“class”,”样式名”) 修改 class 属性的值，修改样式
addClass(“样式名”) 添加样式名称
css() 添加具体的样式 （定义在style属性中的样式）
设置⼀个样式 css("样式名","样式值")
同时设置多个样式
removeClass(class) 移除样式名称
操作元素的内容
⽅法

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。