2.16总结

筛选

//过滤
//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”);

// console.log($("ul>li").eq(0));
    // console.log($("ul>li").eq(-1));
    // console.log($("ul>li:first"));
    // console.log($("ul>li").first());
    // console.log($("ul>li").last());
    // console.log($("ul>li").hasClass("ctn"));
    // console.log($("ul>li").filter(".ctn"));

eq根据索引来获取，当里面参数为-1时表示从后往前第一个
//first() 获取第一个子元素
last 获取最后一个子元素
hasClass 是根据元素的类名称来进行过滤的；
用来判断某个元素是否具有class名称 true/false

console.log($("ul>li").eq(2).hasClass("box"));

判断第二个元素是否有class类"box"

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

//filter 过滤没有过滤的条件 selector

$("ul>li").filter(function (index,ele){
             console.log(index,ele);
            if($(ele).is("#li3"))
            {
                console.log("找到");
            }
        });

is() expr|obj|ele|fn 判断当前元素是什么
is 的返回值是 true/false，存在为true 反之false

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

is 的返回值是 true/false，存在为true 反之false

var newdom=$("ul>li").map(function (index,ele){
            console.log(index, ele);
            return $(ele).html();
        
});

map 将数组映射为一个新的集合，也可以把 map映射当元素的遍历来使用
map映射两种使用，1，将一个集合映射为一个新的集合 2.map可以作为遍历来使用

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

get() 获取当前索引的对象返回值是js对象，不同于eq(index) 返回的是jquery对象

console.log($("ul>li").has(".child"));

has() 过滤元素把当前需要的过滤出来不需要的去除参数：可以是选择器 dom
参数写成 .box 匹配不到元素(直接找的是匹配元素的同级)
参数写成 .box 过滤的元素必须是匹配的元素子内容，指的是子父关系保留的是父

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

not 方法除过他其他都有

console.log($("ul>li").slice(0, 2));

slice 参数是start end 类似数据的slice 截断

查找、

console.log($(".menu").children(".box"));//$("ul>li");
        console.log($(".menu>li"));  和这个一样

children 获取子元素的获取所有的子集元素(直接子集)，可以作为选择器

//console.log($(".menu").find(".box"));  //expr
        //console.log($(".menu").find($(".box")));  //jquery对象
        //console.log($(".menu").find($(".box").get(0))); //ele

find用来查找

console.log($(".menu").find(".box").next());
console.log($(".menu").find(".box").nextAll());

next 获取当前匹配元素的下一个 nextAll 获取当前匹配元素之后的所有元素

/console.log($(".childmenu").offsetParent());

offsetParent() 获取父元素，该方法返回的父元素是定位的

console.log($(".childmenu").parent());
console.log($(".childmenu").parents(".menu"));

parent 获取直接父元素，可以进行过滤

/console.log($(".box").prev());

prev获取当前匹配元素之前的元素，同级元素前一个

console.log($(".box").prevAll("p"));

prevAll获取当前匹配元素之前的元素，同级元素前面所有的

console.log($(".box").siblings());
 console.log($(".box").siblings("p"));

siblings 同胞兄弟元素，不带参数指获取所有的同胞兄弟，用来过滤元素使用。

串联

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

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

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

console.log($("ul").contents());

contents 获取当前元素的所有节点包含文本 childrenNodes

 console.log($("ul").find(".box"));
        console.log($("ul").end());

end 方法是回到上一次破坏性修改上一次修改jquery对象

筛选

查找、

串联

猜你喜欢