關于jQuery中的end()使用方法
更新時間：2011年07月10日 00:05:47 作者：
最近在學習jQuery方面的知識，學習中遇到一定的困難，一些知識不得不查看官方的文檔，在用到end()方法時，被一個小例子搞得有點暈。
在官方的API上是這樣描述end()方法的：“回到最近的一個"破壞性"操作之前。即，將匹配的元素列表變?yōu)榍耙淮蔚臓顟B(tài)?！?；
看樣子好像是找到最后一次操作的元素的上一元素，在如下的例子中：
html代碼：
<div>測試內容1</div>
<div>測試內容2</div>
jQuery代碼：
$('<p>新增內容</p>').appendTo('div').addClass('c1').end().addClass('c2');
得到的結果是：
<div>測試內容1 <p class="c1 c2">新增內容</p></div>
<div>測試內容2 <p class="c1">新增內容</p></div>
這里我就有一點不太明白了，怎么只有第一個<p>標簽有兩個樣式，end()方法后返回的是什么,在火狐里添加了監(jiān)控，得到如下結果：
1.$('<p>新增內容</p>').appendTo('div')返回的是：[p,p]對象數(shù)組，即新增后的兩個p標簽；
2.$('<p>新增內容</p>').appendTo('div').addClass('c1')返回的是：[p.c1,p.c1]對象數(shù)組，即添加了c1類樣式后的p對象數(shù)組；
3.$('<p>新增內容</p>').appendTo('div').addClass('c1').end()返回的是[p.c1],是第1個<div>中的<p>,在2操作中，最后“破壞”的是第2個<div>中的 <p>,所以他的前一次操作的對象是第1個<div>中的<p>,返回的就是它;
4.$('<p>新增內容</p>').appendTo('div').addClass('c1').end().addClass('c2')返回的仍然是第1個<div>中的<p>;
現(xiàn)在算是有點明白了，關鍵是要搞清楚最后一次操作的元素的上一元素是什么。
看樣子好像是找到最后一次操作的元素的上一元素，在如下的例子中：
html代碼：
復制代碼 代碼如下:
<div>測試內容1</div>
<div>測試內容2</div>
jQuery代碼：
復制代碼 代碼如下:
$('<p>新增內容</p>').appendTo('div').addClass('c1').end().addClass('c2');
得到的結果是：
復制代碼 代碼如下:
<div>測試內容1 <p class="c1 c2">新增內容</p></div>
<div>測試內容2 <p class="c1">新增內容</p></div>
這里我就有一點不太明白了，怎么只有第一個<p>標簽有兩個樣式，end()方法后返回的是什么,在火狐里添加了監(jiān)控，得到如下結果：
1.$('<p>新增內容</p>').appendTo('div')返回的是：[p,p]對象數(shù)組，即新增后的兩個p標簽；
2.$('<p>新增內容</p>').appendTo('div').addClass('c1')返回的是：[p.c1,p.c1]對象數(shù)組，即添加了c1類樣式后的p對象數(shù)組；
3.$('<p>新增內容</p>').appendTo('div').addClass('c1').end()返回的是[p.c1],是第1個<div>中的<p>,在2操作中，最后“破壞”的是第2個<div>中的 <p>,所以他的前一次操作的對象是第1個<div>中的<p>,返回的就是它;
4.$('<p>新增內容</p>').appendTo('div').addClass('c1').end().addClass('c2')返回的仍然是第1個<div>中的<p>;
現(xiàn)在算是有點明白了，關鍵是要搞清楚最后一次操作的元素的上一元素是什么。
您可能感興趣的文章:
相關文章
詳解bootstrap用dropdown-menu實現(xiàn)上下文菜單
這篇文章主要介紹了詳解bootstrap用dropdown-menu實現(xiàn)上下文菜單的相關資料,希望通過本文能幫助到大家，需要的朋友可以參考下2017-09-09
jQuery Validate 驗證,校驗規(guī)則寫在控件中的具體實例
本篇文章主要是對jQuery Validate 驗證,校驗規(guī)則寫在控件中的具體實例進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-02-02
分享一個JQuery寫的點擊上下滾動的小例子，學習jquery的朋友可以參考下。2011-08-08
這個函數(shù)的原理是檢查提供的第一個元素（它是由所提供的HTML標記代碼動態(tài)生成的），并在它的代碼結構中找到最上層的祖先元素－－這個祖先元素就是包裹元素。2011-02-02
最近在項目開發(fā)中遇到這樣的需求，點擊購買按鈕，模擬拋物線將物品彈到購物車里，購物車添加物品后，顯示+1動畫。效果非常棒，接下來小編把實例代碼分享到腳本之家平臺，需要的的朋友參考下吧2017-05-05
JQuery的事件處理機制在JQuery框架中起著重要的左右，它就像電視機的開關，我們打開電視機的開關才能看到各個電視臺精彩的節(jié)目，那么我們使用JQuery的事件處理機制就可以創(chuàng)造我們自定義的行為，比如說提交、改變樣式、效果顯示等等，使我們的網(wǎng)頁更加豐富。2010-11-11
jQuery-1.9.1源碼分析系列（十）事件系統(tǒng)之事件包裝
這篇文章主要介紹了jQuery-1.9.1源碼分析系列（十）事件系統(tǒng)之事件包裝的相關資料,需要的朋友可以參考下2015-11-11
這里給大家分享的是一段自己編寫的使用jQuery實現(xiàn)拽調整Div層大小的代碼，非常實用，推薦給有需要的小伙伴們。2015-01-01
這篇文章主要介紹了jQuery自帶的一些常用方法總結,包括$.trim 、$.contains、$.each、$.map、$.inArray、$.extend等,需要的朋友可以參考下2014-09-09
這篇文章主要介紹了jquery二級導航下拉菜單，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-05-05