1. 程式人生 > >DOM元素屬性值如果設置為對象

DOM元素屬性值如果設置為對象

轉換 src 分享 指正 基本數據類型 參數 bsp 元素 屬性

結論:內部會調用toString方法,將設置的對象轉換為字符串添加給相應的屬性;

這個問題呢,是通過jQuery的each方法中,回調函數的this指向問題而來;

我們知道,回調函數中的this如果指向的是基本數據類型,那麽系統會自動將這個基本數據類型的值包裝為對應的對象類型;

就比如:

技術分享

數組裏面存的是string類型的值,然後jq實例調用each方法,打印的this如下圖所示:

技術分享

this指向的基本數據類型的值被轉換為了String類型;

但是這裏說的不是這個問題,而是和這個問題類似,我們在給DOM元素設置屬性值的時候,如果設置的是對象呢?

獲取頁面中的span,然後給兩個span分別設置屬性‘a’,屬性值為兩個對象:

技術分享

看看設置後顯示的結果:

技術分享

第一個屬性值:內部調用toString方法將{a : ‘a‘,b : ‘b‘}對象轉換為字符串設置;

第二個屬性值:同理,也是調用toString方法將String對象的實例轉換為字符串設置;

那麽,我們在回到jQuery中,

如果用each方法給DOM添加屬性值;

jQuery中的each方法的回調函數中的this,如果指向的是字符串類型的數據,那麽在回調函數中操作this給元素添加屬性值,是沒有問題的,因為this即使被轉換為了相應的對象類型數據,那麽再給DOM元素添加的時候,內部會調用toString方法在對象類型的數據轉換為字符串添加,就相當於‘又折騰回來了’;

那麽,如果this指向的不是字符串類型數據,那麽就操作參數吧~

好了,那就到這兒吧,如果有不對的地方,歡迎大家指正,望在前端的道路上共勉!

DOM元素屬性值如果設置為對象