jquery常用筛选方法-创新互联

1、jquery过滤方法
eq(index|-index)
first()
last()
hasClass(class)
filter(expr|obj|ele|fn)
is(expr|obj|ele|fn)
map(callback)
has(expr|ele)
not(expr|ele|fn)
slice(start,[end])
具体事例如下：

目前成都创新互联公司已为近千家的企业提供了网站建设、域名、网页空间、网站托管、服务器托管、企业网站设计、武陵网站维护等服务，公司将坚持客户导向、应用为本的策略，正道将秉承"和谐、参与、激情"的文化，与客户和合作伙伴齐心协力一起成长，共同发展。

<ul>
    <li>第一个</li>
    <li>第二个</li>
    <li class="box" id="li3"><span class="child">第三个</span></li>
    <li>第四个</li>
    <li>第五个</li>
</ul>

eq() 获取子元素里面的其中某一个，根据索引来获取。 -index -1开始的

console.log($("ul>li:first"));
    console.log($("ul>li:eq(0)"));
    console.log($("ul>li:nth-child(1)"));
    console.log($("ul>li").eq(0));//上面四个等价均是第一个li
    console.log($("ul>li").eq(-1));
    console.log($("ul>li:last"));

hasClass(class) 根据元素的类名称来进行过滤的参数是class名称
用来判断某个元素是否具有class名称 true/false
console.log($("ul>li").eq(2).hasClass("box"));
filter 过滤 fn(index,ele)

console.log($("ul>li").filter(".box"));
console.log($("ul>li").filter($(".box")));

is() expr|obj|ele|fn 判断当前元素是什么返回值 true/false

console.log($("ul>li").is(".box"));
console.log($("ul>li").is($(".box")));

map映射两种使用
第一种将一个集合映射为一个新的集合带返回值
第二种不写返回值 map可以作为遍历来使用
必须有回调函数参数为index，ele
jquery 对象集合转为数组需要get()
get(index) js对象不同于eq(index) 返回的是jquery对象

console.log($("ul>li")[0]);
console.log($("ul>li").get(0));

has（）过滤元素把当前需要的过滤出来不需要的去除参数可以是selecto dom
参数写成.box都匹配不到元素（直接找的匹配元素的同级）
参数写成.box 过滤的元素必须是匹配的元素子内容
console.log($("ul>li").has(".child"));
not（）除过回调函数参数index ele
console.log($("ul>li").not(".box"));
console.log($("ul>li").not($(".box")));
slice（）参数是start end 类似数据的slice 截断取小不取大
console.log($("ul>li").slice(0, 2));
2、查找
children([expr])
closest(e|o|e)1.7*
find(e|o|e) expr jquery对象 ele
next([expr])
nextAll([expr])
nextUntil([e|e][,f]) 类似nextAll 方法
offsetParent()
parent([expr])
parents([expr])
parentsUntil([e|e][,f]) 下去自己看
prev([expr])
prevAll([expr])
prevUntil([e|e][,f]) //下去自己看
siblings([expr])

children 获取子元素的获取所有的子集元素(直接子集)
children 参数expr 选择器可以作为简单过滤

find 查找参数可以是expr jquery对象 ele
next 获取当前匹配元素的下一个 nextAll 获取当前匹配元素之后的所有元素
next nextoAll 方法的参数 expr 表达式
prev prevAll 同上
offsetParent() 该方法返回的父元素是定位的在父亲元素中找最近的定位父元素
parent 获取直接父元素 parents所有父亲
siblings 同胞兄弟元素不带参数指获取所有的同胞兄弟参数expr 表达式用来过滤元素使用

3、串联
add(e|e|h|o[,c])1.9*
addBack()1.9+
contents()
end()

<ul>
    <li>1</li>
    <li>2</li>
    <li class="box">3</li>
    <li>4</li>
</ul>
<p class="p1">ppp</p>
<p>p2222</p>

add() 给jquery对象添加新的对象

console.log($("ul>li").add($("p")));
console.log($("ul>li").add("p"));
console.log($("ul>li").add(".p1"));

addBack()
console.log($("ul>li").eq(1).nextAll().addBack());//元素234
contents 获取当前元素的所有节点包含文本 childrenNodes
end 方法是回到上一次破坏性修改上一次修改jquery对象

另外有需要云服务器可以了解下创新互联cdcxhl.cn，海内外云服务器15元起步，三天无理由+7*72小时售后在线，公司持有idc许可证，提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案，具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势，专为企业上云打造定制，能够满足用户丰富、多元化的应用场景需求。

分享名称：jquery常用筛选方法-创新互联
文章起源：https://www.cdcxhl.com/article40/csdieo.html

成都网站建设公司_创新互联，为您提供品牌网站制作、静态网站、网页设计公司、手机网站建设、网站排名、电子商务

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容