關(guān)于jQuery中的end()使用方法
更新時間：2011年07月10日 00:05:47 作者：
最近在學習jQuery方面的知識，學習中遇到一定的困難，一些知識不得不查看官方的文檔，在用到end()方法時，被一個小例子搞得有點暈。
在官方的API上是這樣描述end()方法的：“回到最近的一個"破壞性"操作之前。即，將匹配的元素列表變?yōu)榍耙淮蔚臓顟B(tài)?！?；
看樣子好像是找到最后一次操作的元素的上一元素，在如下的例子中：
html代碼：
<div>測試內(nèi)容1</div>
<div>測試內(nèi)容2</div>
jQuery代碼：
$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end().addClass('c2');
得到的結(jié)果是：
<div>測試內(nèi)容1 <p class="c1 c2">新增內(nèi)容</p></div>
<div>測試內(nèi)容2 <p class="c1">新增內(nèi)容</p></div>
這里我就有一點不太明白了，怎么只有第一個<p>標簽有兩個樣式，end()方法后返回的是什么,在火狐里添加了監(jiān)控，得到如下結(jié)果：
1.$('<p>新增內(nèi)容</p>').appendTo('div')返回的是：[p,p]對象數(shù)組，即新增后的兩個p標簽；
2.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1')返回的是：[p.c1,p.c1]對象數(shù)組，即添加了c1類樣式后的p對象數(shù)組；
3.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end()返回的是[p.c1],是第1個<div>中的<p>,在2操作中，最后“破壞”的是第2個<div>中的 <p>,所以他的前一次操作的對象是第1個<div>中的<p>,返回的就是它;
4.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end().addClass('c2')返回的仍然是第1個<div>中的<p>;
現(xiàn)在算是有點明白了，關(guān)鍵是要搞清楚最后一次操作的元素的上一元素是什么。
看樣子好像是找到最后一次操作的元素的上一元素，在如下的例子中：
html代碼：
復制代碼 代碼如下:
<div>測試內(nèi)容1</div>
<div>測試內(nèi)容2</div>
jQuery代碼：
復制代碼 代碼如下:
$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end().addClass('c2');
得到的結(jié)果是：
復制代碼 代碼如下:
<div>測試內(nèi)容1 <p class="c1 c2">新增內(nèi)容</p></div>
<div>測試內(nèi)容2 <p class="c1">新增內(nèi)容</p></div>
這里我就有一點不太明白了，怎么只有第一個<p>標簽有兩個樣式，end()方法后返回的是什么,在火狐里添加了監(jiān)控，得到如下結(jié)果：
1.$('<p>新增內(nèi)容</p>').appendTo('div')返回的是：[p,p]對象數(shù)組，即新增后的兩個p標簽；
2.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1')返回的是：[p.c1,p.c1]對象數(shù)組，即添加了c1類樣式后的p對象數(shù)組；
3.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end()返回的是[p.c1],是第1個<div>中的<p>,在2操作中，最后“破壞”的是第2個<div>中的 <p>,所以他的前一次操作的對象是第1個<div>中的<p>,返回的就是它;
4.$('<p>新增內(nèi)容</p>').appendTo('div').addClass('c1').end().addClass('c2')返回的仍然是第1個<div>中的<p>;
現(xiàn)在算是有點明白了，關(guān)鍵是要搞清楚最后一次操作的元素的上一元素是什么。
您可能感興趣的文章:
相關(guān)文章
jQuery Layer彈出層傳值到父頁面的實現(xiàn)代碼
這篇文章主要介紹了jQuery Layer彈出層傳值到父頁面的實現(xiàn)代碼,需要的朋友可以參考下2017-08-08
看了《javascript高級程序設計》里面有個表格排序的例子；覺得很有意思，所以自己用jquery的基本庫做了一個，里面的概念基本和書里面的差不多2010-09-09
只需引入jqery.js,不需要引入插件，利用jquery定義的一些基本方法，就能實現(xiàn)諸如隱藏，顯示，淡入，淡出，半透明等2010-12-12
jquery中$.fn和圖片滾動效果實現(xiàn)的必備知識總結(jié)
圖片滾動效果相信大家都使用過，看上去很簡單的一個效果，如果想熟練的掌握必須知道jquery、IIFE、setInterval等基礎以及$.fn用法，下面這篇文章主要介紹了關(guān)于jquery中$.fn和圖片滾動效果制作的必備知識，需要的朋友可以參考下。2017-04-04
jquery插件豐富，很多都是很好用的，最近學習了一下如何制作jquery插件，發(fā)現(xiàn)jquery插件制作其實很簡單，這里介紹一下。2010-06-06
EasyUI在Panel上動態(tài)添加LinkButton按鈕
Easyui的panel面板，在panel的面板中動態(tài)添加Linkbuton按鈕的編輯方法，下面把實現(xiàn)思路及代碼記錄到腳本之家平臺，供大家參考2017-08-08
這篇文章主要為大家詳細介紹了jquery實現(xiàn)簡單自動輪播圖效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-07-07
DataTables+BootStrap組合使用Ajax來獲取數(shù)據(jù)并且動態(tài)加載dom的方法（排序，過濾，分頁等）
Datatables是一款jquery表格插件。它是一個高度靈活的工具，可以將任何HTML表格添加高級的交互功能。這篇文章主要介紹了DataTables+BootStrap組合使用Ajax來獲取數(shù)據(jù)并且動態(tài)加載dom的方法（排序，過濾，分頁等）,需要的朋友可以參考下2016-11-11
本篇文章是對用jquery實現(xiàn)簡單的ajax的實現(xiàn)方法進行了詳細的分析介紹，需要的朋友參考下2013-07-07
這篇文章主要介紹了jquery利用拖拽方式在圖片上添加熱鏈接的方法，其實是用jquery寫了個可以在圖片添加錨點的功能，感興趣的小伙伴們可以參考一下2015-11-11