jquery 笔记

jQuery中页面加载事件和js中页面加载事件区别

js中页面加载事件：

只能写一个；

写多个，后面的会覆盖前面的

jQuery中页面加载事件：

写多个，都会被执行；

jQuery对象与js对象之间的转换

jQuery的本质是一个数组,数组中包含了多个dom对象(document对象)

var jQuery = {dom对象，dom对象,dom对象，dom对象...}

注意：

jQuery对象不能使用dom对象中的属性和方法

dom对象也不能使用jQuery对象中的属性和方法

但是二者之间可以相互转换

转换的格式

1.dom对象-->jQuery对象：穿马甲

格式：

dom对象-->$ (dom对象）；

2.jQuery对象-->dom对象:脱马甲,取出jQuery数组中的dom对象格式：

jQuery对象-->jQuery对象[索引]

jQuery对象-->jQuery对象.get(索引)

$ (function () { 
/*使用dom对象获取id是myDiv的标签
 获取标签体:dom对象.innerHTML 
设置标签体:dom对象.innerHTML = 新的标签体;*/
 var myDivELe = document.getElementById("myDiv");
 //alert (myDivELe . innerHTML) ; 
/* 使用jQuery对象获取id是myDiv的标签 
在jQuery对象中把设置标签体和获取标签体封装为了一个函数,函数名叫html 
获取标签体：jQuery对象.html(); 设置标签体：jQuery对象.html (新的标签体); */ 
var $myDivEle = $("#myDiv"); 
//alert (SmyDivEle.html ());
 //1.dom对象—>jQuery对象：穿马甲 
var $mm= $(myDivELe);
 $mm.html ("你是一个div");
 //Smm.innerHTML = "他是一个div"; 
//jQuery对象不能使用dom对象的属性和方法 
//2.jQuery对象-->dom对象：脱马甲，取出jQuery数组中的dom对象 
var d1 = $myDivEle[0];
 d1.innerHTML = "他是一个div"; 
var d2 = $myDivEle.get(0);
 alert (d2.innerHTML); 
//alert (d2.html ()); 
});

jQuery选择器

基本选择器

层次选择器

重点：

获得A元素内部的所有的B元素：$("A B")--后代选择器(包含子孙)

获得A元素下面的所有B子元素: $("A > B")只有儿子,没有孙子

了解：

获得A元素同级下一个B元素: $("A + B") 下一个兄弟

获得A元素同级所有后面B元素: $("A~B")后边的所有兄弟

获取A元素的同级B元素: $("A").siblings("B")获取所有的兄弟

属性选择器

重点：

获得有属性名的元素：$("A[属性名]")

获得属性名 等于 值 元素 ： $("A[属性名=值]")

复合属性选择器，多个属性同时过滤：$（"A[属性名！=值]….[属性名！=值]"）

了解：

获得属性名 不等于 值 元素 ： $("A[属性名!=值]")

获得属性名 以值 开头 元素： $("A[属性名^=值]")

获得属性名 以值 結尾 元素： $("A[属性名$=值]")

获得属性名 含有 值 元素： $("A[属性名*=值]")

过滤选择器

表单属性选择器