jquery的基础认知

jquery的基础认知

1.获取元素,设置内容

 $("div").text("你好");
//等同于js
var divs=document.getElementsByTagName("div");
for(var i=0;i<divs.length;i++){
     divs[i].textContent="你好";
}

2. $=jQuery

console.log($===jQuery); 

3.支持连缀写法

$("div").text("你好").css("width","50px").attr("abc","a");
//js中的连缀写法
var str = "abcde";
str.split("").reverse().join("");

var obj = {
    a: function () {
        console.log("a");
        return this;
    },
    b: function () {
        console.log("b")
        return this;
    }
}
obj.a().b();

• jQuery对象是一个列表对象，就是操作内容是针对列表中所有元素的($("div")获取的是所有的div元素);
• jQuery对象是不能用DOM的方法和事件 ,它的方法也是仅针对jQuery对象可以使用，DOM对象不能使用
• 但是,有时就是想要对jquery对象使用DOM的方法,所以会有jquery对象和DOM的互相转换

jquery对象-->DOM

console.log($("div")[0]);
console.log($("div").get(0));
console.log(Array.from($("div")));
console.log($("div").get());//获取jQuery对象的DOM  数组

DOM-->jquery

var div=document.querySelector("div");
console.log( $(div))   //直接把元素或者元素列表放入$()中就可以

5.将jQuery列表中第几个元素筛选出jQuery新对象

console.log( $("div").eq(0));   //只获取列表的第0个