jQueryDOM对象总结
作者:唐文坚
撰写时间:2020年4月30日
在JQ里对象提供的方法JS不能用JS里提供的方法JQ不能用
在JQ与JS的操作对比里很明显JQ的操作方法是要比JS方便的多,JS要去记忆某个节点的操作方法
浏览器是否兼容而JQ就不用去管这些相比JQ的代码量也是远远低于JS的代码量。
如何将JS对象转化成一个JQ对象?
这个方法就很简单了,
列:.DOM对象转换为jQuery对象
var box = document.getElementById(“box”);//DOM对象
$(box);//jQuery对象
jQuery对象转换为一个DOM对象
列:var
d
i
v
s
=
divs=
divs=(“div”):该为JQ对象
var div=
d
i
v
s
[
0
]
:
该
为
D
O
M
对
象
使
用
j
Q
u
e
r
y
中
的
g
e
t
(
)
方
法
进
行
转
换
,
只
需
要
提
供
一
个
索
引
就
可
以
了
v
a
r
d
i
v
=
divs[0]:该为DOM对象 使用jQuery中的get()方法进行转换,只需要提供一个索引就可以了 var div=
divs[0]:该为DOM对象使用jQuery中的get()方法进行转换,只需要提供一个索引就可以了vardiv=divs.get(0);//将
d
i
v
s
对
象
中
索
引
为
0
的
元
素
转
换
为
D
O
M
对
象
J
Q
里
常
见
的
元
素
获
取
:
v
a
r
s
=
divs对象中索引为0的元素转换为DOM对象 JQ里常见的元素获取: var s =
divs对象中索引为0的元素转换为DOM对象JQ里常见的元素获取:vars=(“#div”)获取某个元素的ID
var s =
(
“
d
i
v
”
)
获
取
某
个
元
素
的
标
签
v
a
r
s
=
(“div”)获取某个元素的标签 var s =
(“div”)获取某个元素的标签vars=(“.div”)获取某个元素的类
节点的删除:
Remove:这个可以移除节点
Empty:删除匹配集合里的所有子节点
Detach(分离):这个方法与remove不同的是移除的只是字面上的东西,被移除的东西的数据还是会保留下来。
创建节点:
在JQ里创建的点的方法:
$(“body”).append(div);解释在body追加了一个div
$(“b”). appendTo(v);在b里追加了v
var div =
(
"
<
d
i
v
c
l
a
s
s
=
′
b
o
x
′
>
这
是
一
个
通
过
j
Q
u
e
r
y
动
态
添
加
的
d
i
v
<
/
d
i
v
>
"
)
;
节
点
的
外
部
插
入
:
A
f
t
e
r
和
b
e
t
e
r
通
过
a
f
t
e
r
在
选
择
元
素
后
插
入
元
素
,
列
:
("<div class='box'>这是一个通过jQuery动态添加的div</div>"); 节点的外部插入: After和beter 通过after在选择元素后插入元素,列:
("<divclass=′box′>这是一个通过jQuery动态添加的div</div>");节点的外部插入:After和beter通过after在选择元素后插入元素,列:(“x”).after(“s”);
通过beter在选择元素前插入元素,列:
(
"
x
"
)
.
b
e
t
e
r
(
"
s
"
)
;
i
n
s
e
r
t
A
f
t
e
r
和
i
n
s
e
r
t
B
e
f
o
r
e
通
过
i
n
s
e
r
t
A
f
t
e
r
在
选
择
元
素
后
插
入
元
素
,
列
:
("x").beter ("s"); insertAfter和insertBefore 通过insertAfter在选择元素后插入元素,列:
("x").beter("s");insertAfter和insertBefore通过insertAfter在选择元素后插入元素,列:(“x”).insertAfter (“s”);
通过insertBefore在选择元素前插入元素,列:$(“x”).insertBefore (“s”);
类似的有get(index),不过get(index)返回的是DOM对象。
参数说明:index 一个整数,指示元素基于0的位置,这个元素的位置是从0算起。
-index 一个整数,指示元素的位置,从集合中的最后一个元素开始倒数。(-1算起)
first() 获取第一个元素
last()获取最后个元素
hasClass(class) 检查当前的元素是否含有某个特定的类,如果有,则返回true
这其实就是 is("." + class)。
filter(expr|obj|ele|fn) 筛选出与指定表达式匹配的元素集合。
这个方法用于缩小匹配的范围。用逗号分隔多个表达式
find(expr|obj|ele)
搜索所有与指定表达式匹配的元素。这个函数是找出正在处理的元素的后代元素的好方法