jQuery中易混淆 錯誤理解概念總結(逐漸新增)

2021-07-25 07:35:15 字數 1898 閱讀 7098

一、 .attr(attrname,function(index,oldvalue){})中index值

我們都知道.attr()方法中的通過返回值修改原屬性的值的函式中的oldvalue指的是元素修改前的值

但是很少能找到index值的用法的例項,只是簡單說明了index是選中元素在同級元素中的索引值。這個概念很模糊,剛開始我以為是html文字流中的index。但通過實驗發現並不單純是。下面我們來詳細說下index值的意義。

測試**如下:

剛開始我以為應該返回2.因為說是選中元素在同級元素的索引值麼。但實際返回的是0

通過測試之後我發現  資料中所說的『選中元素的同級元素』這個概念是指$(selector)中的selector。即index是指selector中元素的index【按他們在html的index,而非在selector的index,即selector中的順序不影響index值】  這麼說可能有點亂,也有點繞。下面我舉幾個例子大家就明了了。

將$('input:eq(2)') 改為 $('input:eq(2),input:eq(1),input:eq(3),input:eq(0)')

就算你亂它們的本來順序,返回的i也是按他們實際的索引號來排的。這種情況i= 0 1 2 3 ,input:eq(2)的i=2。

如果將$('input:eq(2)') 改為 

$('input:eq(2),input:eq(1),input:eq(3)')

第乙個例子是包含了所有的input,但如果不是包含了所有的情況又不一樣了。這種情況i=0 1 2,input:eq(2)的i=1

所以總結下:

index總是以0開始,然後再按照selector元素在html的index值進行排序。

二、.html()和.text()的區別

.html()返回選擇元素的內部html內容【即包含標籤和內容】

.text()返回的是選中元素所包含的html中的內容的集合

.html(string)和.text(string)暫未發現區別  都會將選中元素的內容替換,如果選中元素是父元素,那麼裡面的標籤和內容也會被替換掉。

如原內容

替換後: 新內容

另外 .html()方法使用在多個元素上時,只讀取第乙個元素。而.text()講讀取所有選中元素的文字內容

:first-child

第二個元素

:last-child

:first-child

第二個元素

:last-child

顯示通過html方法獲取到的內容

顯示通過text方法獲取到的內容

結果如下圖

.html()與.text()

:first-child 第二個元素 :last-child

:first-child 第二個元素 :last-child

顯示通過html方法獲取到的內容

:first-child

第二個元素

:last-child

:first-child

第二個元素

:last-child

顯示通過text方法獲取到的內容

:first-child 第二個元素 :last-child :first-child 第二個元素 :last-child

JQuery中易混淆的概念

向每個匹配的元素內部追加內容。i would like to say i would like to say hello 把所有匹配的元素追加到另乙個 指定的元素集合中。i would like to say i would like to say i would like to say i wou...

不易理解易混淆的詞彙(二)

宣告 錯了另刂扌丁我 如若有誤,請記得指出喲,謝謝了!閉包 closure 是引用了自由變數的函式。如果內部函式裡引用了外部函式裡定義的物件 甚至是外層之外,但不是全域性變數 那麼此時內部函式就被稱為閉包函式 裝飾器 decorator 為已存在的函式或物件新增額外的功能。如 插入日誌 效能測試 事...

numpy中的易混淆點

論numpy中matrix 和 array的區別 numpy matrices必須是2維的,但是 numpy arrays ndarrays 可以是多維的 1d,2d,3d nd matrix是array的乙個小的分支,包含於array。所以matrix 擁有array的所有特性。在numpy中ma...