setAttribute()、getAttribute()與ele[attr]與自定義屬性


一、自定義屬性設置

1.setAttrbute()

var q=document.getElementById("q");
q.setAttribute("index",0);
console.dir(q);

我們分別來看一下它在IE8、9和chrome中的表現。

IE7、8:

我們可以看到,用setAttribute設置的自定義屬性會出現在元素標簽中,並且出現在元素對象屬性上。

IE9:

我們可以看到,自定義屬性依然出現在元素標簽中,但並不是直接存放在元素對象下的屬性,而是存在於元素對象下的attributes屬性下。

chrome:

可以發現,自定義屬性依然出現在元素標簽中,存在於元素對象下的attributes屬性下。

  總結,setAttribute()用於設置在標簽中顯示的元素,在IE6,7中通通放在元素屬性下;而在IE9和chrome中,,與直接寫在標簽中的屬性一同存放於attributes屬性下。

 

2.ele[attr]

    q.index=0;
    console.dir(q);

我們分別來看一下它在IE8、9和chrome中的表現。

IE7、8:

我們可以看到,與setAttribute效果一樣。

IE9:

我們可以看到,自定義屬性沒有出現在元素標簽中,存於在元素對象的屬性下。

chrome:

可以發現,自定義屬性沒有出現在元素標簽中,存在於元素對象下得屬性下。

  總結,ele[attr]在設置自定義屬性時,不會出現在元素標簽中,只存在於元素對象下。

 

二、獲取屬性

  獲取自定義屬性時,getAttribute()會根據setAttribute()的存放位置進行獲取;同樣,ele[attr]也會根據上述ele[attr]的存放位置進行獲取;在混用的時候,在ie6,7,8中不會有問題,但在高版本的瀏覽器中,由於setAttribute()和ele[attr]存放位置不同,就不一定能取到東西。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM