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個