一.JQuery庫中的'$()'是什么部宿？
$()函數(shù)是JQuery()函數(shù)的別稱烫饼。$()函數(shù)用于將任何對象包裹成
JQuery對象谒获，接著你就被允許調(diào)離定義在JQuery對象上的多個
不同方法桃纯。你可以將一個選擇器字符串傳入$()函數(shù)睦裳，它會返回
一個包含所有匹配的DOM元素數(shù)組的JQuery對象
二.$(this) 和 this 關鍵字在 jQuery 中有何不同？
$(this) 返回一個 jQuery 對象仙畦，你可以對它調(diào)用多個 jQuery 方
法输涕，比如用 text() 獲取文本，用val() 獲取值等等慨畸。而 this 代表當
前元素莱坎，它是 JavaScript 關鍵詞中的一個，表示上下文中的當前
DOM 元素寸士。你不能對它調(diào)用 jQuery 方法型奥，直到它被 $() 函數(shù)包裹，例如 $(this)碉京。
三.jquery操作
1.jQuery 元素選擇器
jQuery 使用 CSS 選擇器來選取 HTML 元素厢汹。
$("p") 獲取 <p> 元素。
$(".p")獲取class名為p的元素
$("#p")獲取id名為p的元素
2.jQuery CSS 選擇器
jQuery CSS 選擇器可用于改變 HTML 元素的 CSS 屬性谐宙。
下面的例子把所有 p 元素的背景顏色更改為紅色：
$("p").css("background-color","red");
3.jQuery獲得內(nèi)容/設置內(nèi)容
text() - 設置或返回所選元素的文本內(nèi)容
html() - 設置或返回所選元素的內(nèi)容（包括 HTML 標記）
val() - 設置或返回表單字段的值
4.設置屬性 - attr():
一般用于設置自定義屬性
$("#test").attr("test","aaa") // 設置
參數(shù)一:參數(shù)名稱
參數(shù)二:參數(shù)內(nèi)容
//添加自定義屬性(增烫葬，改)
// $('.box').attr('index', 1);
//刪除自定義屬性(刪)
// $('.box').attr('index', null);
//查找屬性(查)
// console.log($('.box').attr('index'))
// console.log($('.box'));
5.刪除屬性 - removeAttr()
$("#test").removeAttr("test") // 刪除
6.添加新的 HTML 內(nèi)容
1.append() 方法在被選元素的結尾插入內(nèi)容。
var $h = $('<div class="box2"></div>')
在body的后面加入$h
$('body').append($h)
將$h添加到body的最后面
$h.appendTo($('body'));
2.prepend() 方法在被選元素的開頭插入內(nèi)容凡蜻。
將$h添加到body的首位
var $h = $('<div class="box2"></div>')
$h.prependTo($('body'))
3.after() 和 before() 方法
after() 方法在被選元素之后插入內(nèi)容搭综。
before() 方法在被選元素之前插入內(nèi)容。
在元素的最后添加一個元素
$('.box').after($('<div class="box3"></div>'))
在元素的首位添加一個元素
$('.box').before($('<div class="box2"></div>'))
7.刪除remove()
remove() 方法刪除被選元素及其子元素划栓。
$('.box2').remove();
empty() 方法刪除被選元素的子元素兑巾。
$("#div1").empty();
8.替換元素replaceAll()
//用A替換B 返回A
$('<div class="box1"></div>').replaceAll($('.box3'));
9.clone() 克隆
A.clone(); 克隆 深克隆 克隆A
$('.box1').clone().appendTo($('.box'));
10.獲取父元素parent()
A.parent();找A的父元素
console.log($('.box').parent())
11.查找子元素children()
//查找A的子元素 返回一個集合
console.log($('.ul').children())
12.獲取兄弟元素 next() prev()
//A.next(): 查找A的下一個兄弟元素
//A.prev(): 查找A的上一個兄弟元素
//A.siblings():獲取所有兄弟元素
console.log($('.box').prev)
13.對類名的操作
//添加類名
$('.box').addClass('box5');
//刪除類名
$('.box').removeClass('box5');
//切換類名
$('div').toggleClass('box6');
//設置內(nèi)容，也可以添加元素
$('.box').html($('<div class="p"></div>'))
14.jQuery 尺寸 方法
1.width() height()
width() 方法設置或返回元素的寬度（不包括內(nèi)邊距忠荞、邊框或外邊距）蒋歌。
height() 方法設置或返回元素的高度（不包括內(nèi)邊距、邊框或外邊距）委煤。
//讀寫 當沒有參數(shù)的時候 是讀取寬高 當有參數(shù)的時候 設置寬高
$('.box').css('width','800px')
.css('height','800px')
console.log($('.box').width())//800
console.log($('.box').height())//800
2.innerWidth() 和 innerHeight()
innerWidth() 方法返回元素的寬度（包括內(nèi)邊距）堂油。
innerHeight() 方法返回元素的高度（包括內(nèi)邊距）。
3.outerWidth() 和 outerHeight()
outerWidth() 方法返回元素的寬度（包括內(nèi)邊距和邊框）碧绞。
outerHeight() 方法返回元素的高度（包括內(nèi)邊距和邊框）府框。
2.讀取元素的偏移量 top/left
console.log($('.box').offset().left)
console.log($('.box').offset().top)
3.position 讀取元素的定位值
console.log($('.box').position())
4.滾動偏移
scrollTop() / scrollLeft();
console.log($('.box').scrollTop())
15.事件綁定
1.點擊事件
// $('.box').click(function(){
// $('.box').css('background','green')
// })
2.移出事件
$('.box').off('click');
JQuery中addClass,removeClass,toggleClass的使用。
$(selector).addClass(class)：為每個匹配的元素添加指定的類名
$(selector).removeClass(class)：從所有匹配的元素中刪除全部或者指定的類讥邻，刪除class中某個值迫靖；
$(selector).toggleClass(class)：如果存在（不存在）就刪除（添加）一個類
$(selector).removeAttr(class);刪除class這個屬性；
