亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

.slideDown()：用滑動動畫顯示一個匹配元素

.slideDown()方法將給匹配元素的高度的動畫，這會導致頁面的下面部分滑下去，彌補了顯示的方式

常見的操作，提供一個動畫是時間，然后傳遞一個回調，用于知道動畫是什么時候結束

.slideDown( [duration ] [, complete ] )

持續時間（duration）是以毫秒為單位的，數值越大，動畫越慢，不是越快。字符串 'fast' 和 'slow' 分別代表200和600毫秒的延時。如果提供任何其他字符串，或者這個duration參數被省略，那么默認使用400 毫秒的延時。

具體使用：

$("ele").slideDown(1000,?function()?{
????//等待動畫執行1秒后,執行別的動作....
});

注意事項：

• 下拉動畫是從無到有，所以一開始元素是需要先隱藏起來的，可以設置display:none

• 如 果提供回調函數參數，callback會在動畫完成的時候調用。將不同的動畫串聯在一起按順序排列執行是非常有用的。這個回調函數不設置任何參數，但是 this會設成將要執行動畫的那個DOM元素，如果多個元素一起做動畫效果，那么要非常注意，回調函數會在每一個元素執行完動畫后都執行一次，而不是這組 動畫整體才執行一次

show與hide是一對互斥的方法。需要對元素進行顯示隱藏的互斥切換，通常情況是需要先判斷元素的display狀態，然后調用其對應的處理方法。比如顯示的元素，那么就要調用hide，反之亦然。 對于這樣的操作行為，jQuery提供了一個便捷方法toggle用于切換顯示或隱藏匹配元素

基本的操作：toggle();

這是最基本的操作，處理元素顯示或者隱藏，因為不帶參數，所以沒有動畫。通過改變CSS的display屬性，匹配的元素將被立即顯示或隱藏，沒有動畫。

• 如果元素是最初顯示，它會被隱藏

• 如果隱藏的，它會顯示出來

display屬性將被儲存并且需要的時候可以恢復。如果一個元素的display值為inline，然后是隱藏和顯示，這個元素將再次顯示inline

提供參數：.toggle( [duration ] [, complete ] )

同樣的提供了時間、還有動畫結束的回調。在參數對應的時間內，元素會發生顯示/隱藏的改變，在改變的過程中會把元素的高、寬、不透明度進行一系列動畫效果。這個元素其實就是show與hide的方法

直接定位：.toggle(display)

直接提供一個參數，指定要改變的元素的最終效果

其實就是確定是使用show還是hide方法

if?(?display?===?true?)?{
??$(?"elem"?).show();
}?else?if?(?display?===?false?)?{
??$(?"elem"?).hide();
}

toggle方法就是show與hide的相互切換的一個快捷方法

css中有display:none屬性，同時也有display:block，所以jQuery同樣提供了與hide相反的show方法

方法的使用幾乎與hide是一致的，hide是讓元素顯示到隱藏，show則是相反，讓元素從隱藏到顯示

看一段代碼：使用上一致，結果相反

$('elem').hide(3000).show(3000)

讓元素執行3秒的隱藏動畫，然后執行3秒的顯示動畫。

show與hide方法是非常常用的，但是一般很少會基于這2個屬性執行動畫，大多情況下還是直接操作元素的顯示與隱藏為主

注意事項：

• show與hide方法是修改的display屬性，通過是visibility屬性布局需要通過css方法單獨設置

• 如果使用!important在你的樣式中，比如display: none !important，如果你希望.show()方法正常工作，必須使用.css('display', 'block !important')重寫樣式

• 如果讓show與hide成為一個動畫，那么默認執行動畫會改變元素的高度，高度，透明度

讓頁面上的元素不可見，一般可以通過設置css的display為none屬性。但是通過css直接修改是靜態的布局，如果在代碼執行的時候，一般是通過js控制元素的style屬性，這里jQuery提供了一個快捷的方法.hide()來達到這個效果

$elem.hide()

提供參數：

.hide(?options?)

當提供hide方法一個參數時，.hide()就會成為一個動畫方法。.hide()方法將會匹配元素的寬度，高度，以及不透明度，同時進行動畫操作

快捷參數：

.hide("fast?/?slow")

這是一個動畫設置的快捷方式，'fast' 和 'slow' 分別代表200和600毫秒的延時，就是元素會執行200/600毫秒的動畫后再隱藏

注意：

jQuery在做hide操作的時候，是會保存本身的元素的原始屬性值，再之后通過對應的方法還原的時候還是初始值。比如一個元素的display屬性值為inline，那么隱藏再顯示時，這個元素將再次顯示inline。一旦透明度 達到0，display樣式屬性將被設置為none，這個元素將不再在頁面中影響布局

$('li').index()沒有參數的時候，是第一個li相對于同輩元素的位置；

$('li').index($('#text'))?就是傳入的對象$('#text')相對于li的位置

show/hide、sildeDown/sildeUp、fadeIn/fadeOut。除此之外，還引入了toggle、sildeToggle以及fadeToggle切換方法

toggle、sildeToggle以及fadeToggle的區別：

• toggle：切換顯示與隱藏效果

• sildeToggle：切換上下拉卷滾效果

• fadeToggle：切換淡入淡出效果

當然細節上還是有更多的不同點:

toggle與slideToggle細節區別：

• toggle：動態效果為從右至左。橫向動作，toggle通過display來判斷切換所有匹配元素的可見性

• slideToggle：動態效果從下至上。豎向動作，slideToggle 通過高度變化來切換所有匹配元素的可見性

fadeToggle方法

• fadeToggle() 方法在 fadeIn() 和 fadeOut() 方法之間切換。

• 元素是淡出顯示的，fadeToggle() 會使用淡入效果顯示它們。

• 元素是淡入顯示的，fadeToggle() 會使用淡出效果顯示它們。

• 注釋：隱藏的元素不會被完全顯示（不再影響頁面的布局）

$,inArray('a',['a','b','c','a','d'],2] 起始從2開始檢索'a'的序號;

等價于['a','b','c','a','d'].indexOf('a',2);

toggle與slideToggle細節區別：

• toggle：動態效果為從右至左。橫向動作，toggle通過display來判斷切換所有匹配元素的可見性

• slideToggle：動態效果從下至上。豎向動作，slideToggle 通過高度變化來切換所有匹配元素的可見性

隱藏元素方法：$("選擇元素").hide()

參數：.hide(option) .hide("fast/slow")

get方法是通過已知的索引在合集中找到對應的元素。如果反過來，已知元素如何在合集中找到對應的索引呢？

.index()方法，從匹配的元素中搜索給定元素的索引值，從0開始計數。

語法：參數接受一個jQuery或者dom對象作為查找的條件

.index()
.index(?selector?)
.index(?element?)

• 如果不傳遞任何參數給 .index() 方法，則返回值就是jQuery對象中第一個元素相對于它同輩元素的位置

• 如果在一組元素上調用 .index() ，并且參數是一個DOM元素或jQuery對象， .index() 返回值就是傳入的元素相對于原先集合的位置

• 如果參數是一個選擇器， .index() 返回值就是原先元素相對于選擇器匹配元素的位置。如果找不到匹配的元素，則 .index() 返回 -1

簡單來說：

<ul>
????<a></a>
????<li?id="test1">1</li>
????<li?id="test2">2</li>
????<li?id="test3">3</li>
</ul>

$("li").index() 沒有傳遞參數，反正的結果是1，它的意思是返回同輩的排列循序，第一個li之前有a元素,同輩元素是a開始為0，所以li的開始索引是1

如果要快速找到第二個li在列表中的索引,可以通過如下2種方式處理

$("li").index(document.getElementById("test2"))?//結果：1$("li").index($("#test2"))??//結果:1

jQuery是一個合集對象，如果需要單獨操作合集中的的某一個元素，可以通過.get()方法獲取到

以下有3個a元素結構：

<a>1</a>
<a>2</a>
<a>3</a>

通過jQuery獲取所有的a元素合集$("a")，如果想進一步在合集中找到第二2個dom元素單獨處理，可以通過get方法

語法：

.get(?[index?]?)

注意2點

1. get方法是獲取的dom對象，也就是通過document.getElementById獲取的對象

2. get方法是從0開始索引

所以第二個a元素的查找： $(a).get(1)

負索引值參數

get方法還可以從后往前索引，傳遞一個負索引值，注意的負值的索引起始值是-1

同樣是找到第二元素，可以傳遞?$(a).get(-2)?

jQuery.trim()函數用于去除字符串兩端的空白字符

這個函數很簡單，沒有多余的參數用法

需要注意：

• 移除字符串開始和結尾處的所有換行符，空格(包括連續的空格)和制表符（tab）

• 如果這些空白字符在字符串中間時，它們將被保留，不會被移除

jQuery.inArray()函數用于在數組中搜索指定的值，并返回其索引值。如果數組中不存在該值，則返回 -1。

語法：

jQuery.inArray(?value,?array?,[?fromIndex?]?)

用法非常簡單，傳遞一個檢測的目標值，然后傳遞原始的數組，可以通過fromIndex規定查找的起始值，默認數組是0開始

例如：在數組中查找值是5的索引

$.inArray(5,[1,2,3,4,5,6,7])?//返回對應的索引：4

注意：

如果要判斷數組中是否存在指定值，你需要通過該函數的返回值不等于(或大于)-1來進行判斷

語法

jQuery.each(array,?callback?)
jQuery.each(?object,?callback?)

第一個參數傳遞的就是一個對象或者數組，第二個是回調函數

$.each(["Aaron",?"慕課網"],?function(index,?value)?{
???//index是索引,也就是數組的索引
???//value就是數組中的值了
});

each就是for循環方法的一個包裝，內部就是通過for遍歷數組與對象，通過回調函數返回內部迭代的一些參數，第一個參數是當前迭代成員在對象或數組中的索引值(從0開始計數)，第二個參數是當前迭代成員(與this的引用相同

jQuery.each()函數還會根據每次調用函數callback的返回值來決定后續動作。如果返回值為false，則停止循環(相當于普通循環中的break)；如果返回其他任何值，均表示繼續執行下一個循環。

$.each(["Aaron",?"慕課網"],?function(index,?value)?{
????return?false;?//停止迭代
});

?

jQuery方法可以很方便的遍歷一個數據，不需要考慮這個數據是對象還是數組