1.过滤案例

过滤：在jQuery对象数组中，过滤出一部分元素 ：
//              1)、首先获取ul中所有的li子元素，即会产生一个li数组uls。然后：//空格选择器 在后台里面查找//>：在所有子标签查找// $("ul li").css({"background":"pink"});//获取全部var a = $("ul>li");
//              2)、first()：获取数组uls中的第一个元素，即第一个li标签.// a.first().css({"background":"pink"});//里面可以传参数随便获取哪一个// $("ul>li:first").css({"background":"pink"});//只能获取第一个
//              3)、last()：获取数组uls中的最后一个元素，即最后一个li标签.// a.last().css({"background":"pink"});//获取最后一个
//              4)、eq(index):从数组uls中找到下标为2的元素.// a.eq(2).css({"background":"pink"});//获取下标为二的
//                  4.1)、从数组uls中找到倒数第2个元素.// a.eq(-2).css({"background":"pink"});//获取倒数第二个
//              5)、filter(selector)：匹配到类名为sa的元素。// a.filter(".sa").css({"background":"pink"});//获取类名为sa的
//                  5.1)、匹配到有属性title，并且值为a的元素.// a.filter("[title=a]").css({"background":"pink"});
//                  5.2)、匹配到属性title的值不为a的元素// a.filter("[title!=a]").css({"background":"pink"});
//                  5.3)、匹配到有title属性，且属性值不为a的元素.// a.filter("[title][title!=a]").css({"background":"pink"});
//                  5.4)、从数组uls中过滤出有title属性的元素集合.// a.filter("[title]").css({"background":"pink"});
//              6)、has(selector)：从数组uls中过滤出有<span>标签的元素集合.// a.has("span").css({"background":"pink"});
//              7)、从数组uls中过滤出没有title属性的元素集合.// a.not("[title]").css({"background":"pink"})

2.查找

查找：在jQuery对象数组中，查找出一部分元素：
//              1)、children()：查找ul的所有子标签
//                  1.1)、查找ul的所有li子标签// $("ul").children("li").css({"background":"pink"})//带参数是找指定的，不带是找全部
//              3)、find()：查找ul下面所有的span标签// $("ul").find("span").css({"background":"pink"})
//              4)、parent()：查找b标签的父元素标签// $("b").parent().css({"background":"pink"})
//              5)、pervAll()：查找第三个(下标为2)li标签前面所有的兄弟标签// $("ul>li").eq(2).prevAll().css({"background":"pink"})
//              6)、nextAll():查找第三个(下标为2)li标签后面所有的兄弟标签// $("ul>li").eq(2).nextAll().css({"background":"pink"})
//                  6.1)、查找第三个(下标为2)li标签后面所有的兄弟标签，并且只能是li标签// $("ul>li").eq(2).nextAll("li").css({"background":"pink"})
//              8)、siblings():查找第三个(下标为2)li标签前后所有的兄弟标签// $("ul>li").eq(2).siblings().css({"background":"pink"})
//                  8.1)、查找第三个(下标为2)li标签前后所有的兄弟标签，并且只能是li标签// $("ul>li").eq(2).siblings("li").css({"background":"pink"})

3.文档处理

增加

1)、append():元素内部插入(之后)//                 1.1)、给ul中最后一个li子标签内部的后面再插入一个li标签。// var aa = $("ul>li").eq(-1).css({"background":"pink"});// aa.append("<li>666</li>");//方式一// $("ul>li").eq(-1);//方式二// $("ul>li").last();//方式三// $("ul").chlidren("li").eq(-1);//方式四// $("ul").chlidren("li").last();
//                  1.2)、往ul的每个li子标签内部的末尾追加一个li标签。// $("ul>li").append("<li>777</li>");
//                  1.3)、往ul的最后一个子标签后面追加一个li标签。// $("ul").children().eq(-1).css({"background":"pink"})// $("ul").children().last().append("<li>999</li>")//appendto用法// $("<li>9999</li>").appendTo($("ul").children().last())
//              2)、prepend()：元素内部插入(之前)
//                  2.1)、给ul中第一个li子标签内部的前面再插入一个li标签。// $("ul>li").first().prepend("<li>39</li>");
//              3)、after():元素外部插入(之后):
//                  3.1)、在属性titile为b的元素后面添加一个li// $("[title=b]").after("<li>帅比到此一游</li>");
//              4)、before():元素外部插入(之前):
//                  4.1)、在属性title为b的元素前面添加一个li// $("[title=b]").before("<li>大帅比到此一游</li>");
//          3.2、replaceWith()和replaceAll()：改(替换)
//              1)、把所有li标签下面的所有的span标签替换为文本框标签//replaceWith()使用方法// $("li span").replaceWith("<input type='text' />");//replaceAll()使用方法// $("<input type='text' />").replaceAll($("li span"));

删除

删除：empty()和remove()
//                  1.1)、删除ul中所有的子节点.// $("ul").empty();//不会删除当前所匹配的标签// $("ul").remove();//会删除当前所匹配的标签
//                  1.2)、删除ul中所有的li子节点里面所有的子节点.// $("ul>li").empty();// $("ul>li").remove();
//                  1.3)、删除ul中所有的li节点里面所有的子节点.// $("ul li").empty();// $("ul li").remove();

jQuery筛选-文档处理相关推荐

jQuery (筛选文档处理)
大家好,我是小陽,我又来了,今天我给大家带来的是jQuery的筛选and文档处理,希望能给大家带来一些知识上的帮助! 目录一.思维导图二.jQuery的筛选三.jQuery的文档处理一.思维导 ...
jquery获取文档高度和窗口高度的例子
jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...
jQuery基础文档(持续更新)
文章目录 jQuery基础文档(持续更新) 1 jQuery入门仪式: jQuery基础文档(持续更新) 1 jQuery入门仪式: 还是先上一段代码吧,对照这看: <!DOCTYPE html ...
JQuery 查询文档元素
JQuery jQuery 为web脚本编程提供了通用的抽象层,使得它几乎用于任何脚本编程的情形. jQuery 能够满足如下功能: l 取得页面的元素 l 修改页 ...
jquery ui 文档使用总结
介绍jquery ui文档中的api如何使用 <!doctype html> <html lang="us"> <head> <meta ...
jQuery之筛选文档处理
目录回顾上一节: ??? $工具的类方法(类似java中的静态方法) ?? ??? ??? ??? jQuery控制属性设置以及css样式设置 ? 用jQuery实现全选框与复选框的事件: 本节内容 ...
jQuery的文档操作方法
jQuery 文档操作方法这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...
Js和jQuery的文档就绪函数以及执行次数
https://www.cnblogs.com/yingyingh5/p/7786821.html 文档就绪函数的使用方法是: 完整方式: $(document).ready(fn) 或者jQuery ...
jQuery-03 (筛选文档处理)
1.筛选--过滤 1.1 first():获取匹配的第一个元素从元素数组中找到第一个元素 //--过滤出指定表达式匹配的元素// first() 获取id为oul下的所有li元素,然后找到第一个元素 ...

jQuery筛选-文档处理

1.过滤案例

2.查找

3.文档处理

增加

删除

jQuery筛选-文档处理相关推荐

最新文章

热门文章