通过浏览器调试:
我们通过数组可以类比出:jQuery对象其实是一个长度为4的dom对象数组
button #mae01……button#mae04
所以jQuery对象其实就是一个DOM对象数组
jQuery对象本质:DOM对象的数组+jQuery提供的一系列函数功能
jQuery对象与js对象的转换:
jQuery->js: $(DOM对象);
js->jQuery:jQuery对象[下标]
通过数组下标取出dom对象
jQuery对象的迭代:
C++Java
Python
JavaScript
四、jQuery选择器
与CSS选择器 类似
基本选择器
后代选择器
子选择器
并集选择器
伪类选择器
五、jQuery元素的筛选
- eq(index):获取该index个元素(从0开始)
//获取第2个p元素:
Hello China
`$(“p”).ep(2);
`
//html
<p>Hello</p><p>Hello China</p><p class="selected">Hello World</p>
- filter(exp):获取与指定exp匹配的元素
//js 获取类名为select的元素:
Hello World
$(“p”).filter(“.selected”)`
//html
<p>Hello</p><p>Hello China</p><p class="selected">Hello World</p>
-
parent():得到元素的父元素
-
find(exp):返回匹配给定选择器的后代元素
//从所有段落开始,进一步搜索span元素,即后代选择器
$(“p”).find(“span”)
HelloHello World
-
nextAll():返回当前元素所有兄弟元素
-
next():返回当前元素耳朵下一个兄弟元素
六、jQuery属性标签
不传参数是获取,传参数是设置
-
html():起始标签和结束标签中的内容,与DOM对象的innerHTML相同
-
txet():起始标签和结束标签中的内容,与iDOM对象的nnerText相同
-
val():表单项的value属性值,与DOM对象的value相同
-
attr()、prop():设置和获取属性值
七、DOM的增删改
内部插入
appendTo(content) a.appendTo(b); 把a加到b里面 添加到最后面
prependTo(content) a.prependTo(b); 把a添加到b里面 添加到最前面
外部插入
insertAfter(content) a.insertAfter(b); 把a插入到b的后面
insertBefore(content) a.insertBefore(b); 把a插入到b的前面
替换
replaceWith(content|fn) a.replaceWith(b) 用b替换所有的a
replaceAll(selector) a.replaceAll(b) 用a替换所有的b
删除
empty() a.empty() 把a掏空,把a里面的所有元素都删除
remove([expr]) a.remove(b) 所有的a,是b的话就会删除 a.remove() 删除a
八、CSS样式操作
//参数可以传类名
addClass(class|fn) 添加样式
removeClass(class|fn) 删除样式
toggleClass(class|fn) 替换样式(有就删除,没有就添加)
offse(class|fn) 获取和设置元素的坐标
//即给p标签添加上selected类的属性
$(“p”).addClass(“selected”);
九、jQuery动画
第一个参数:动画执行时间
第二个参数:动画的回调函数,即动画完成后,自动调用的函数
基本动画:
show() 将隐藏元素显示
hide() 将显示元素隐藏
toggle() 替换
淡入淡出动画:
fadeIn() 淡入
fadeout() 淡出
fadeTo() 在指定时长内慢慢将透明度修改到指定值
透明度:0(完全透明)-1(完全可见)
fadeToggle() 淡入/淡出切换
十、jQuery事件操作
Java面试核心知识点笔记
其中囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。
Java中高级面试高频考点整理
最后分享Java进阶学习及面试必备的视频教学
Java面试核心知识点笔记
其中囊括了JVM、锁、并发、Java反射、Spring原理、微服务、Zookeeper、数据库、数据结构等大量知识点。
[外链图片转存中…(img-EzBmFXVm-1714513240971)]
Java中高级面试高频考点整理
[外链图片转存中…(img-usV7LqYV-1714513240971)]
[外链图片转存中…(img-EGywbKXK-1714513240972)]
最后分享Java进阶学习及面试必备的视频教学
[外链图片转存中…(img-HRQx1GW2-1714513240972)]
本文已被CODING开源项目:【一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码】收录