成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

attr()和prop()的前世今生

RobinQu / 2137人閱讀

摘要：簡單地說，表示標簽的屬性，而表示對象的屬性。在的在早期版本中，沒有區(qū)分出和，只有一個。在此之前，的職能只能由代為行使。官方建議，對于只有和兩個值的屬性如等，應(yīng)當使用。因此，我們還是要遵循官方的建議，該用的地方就不要再用了。

attr(全稱為attribute),prop(全稱為property),兩者都可以翻譯為屬性，為了區(qū)分二者，有些中文文檔將前者翻譯為特性，后者翻譯為屬性。簡單地說，attr表示HTML標簽的屬性，而prop表示DOM對象的屬性。二者從本質(zhì)上來說是不一樣的，但它們常常被混為一談，部分原因在于DOM對象的屬性大多與其所對應(yīng)的HTML屬性同名，比如id,href,type，但也有不同，比如DOM對象中有className屬性，而HTML標簽中有class屬性。
    
    在jquery的在早期版本中，沒有區(qū)分出attr和prop，只有一個attr()。jQuery 1.6版本，提供了一個新的方法來獲取和設(shè)置屬性，這個方法這是prop()。在此之前，prop()的職能只能由attr()代為行使。官方建議，對于只有true和false兩個值的屬性（如checked、selected、disabled等），應(yīng)當使用prop()。如果你偏偏就不聽建議，就是要用attr()，那么讓我們看下有什么后果（此處以checked為例）。

    這是HTML代碼：



    這是jQuery代碼：

$(function(){
    $("input").change(function(){
        console.log($(this).attr("checked"));
        console.log($(this).prop("checked"));
        });
    });
 
    在不同的jquery版本下，有不同的輸出結(jié)果,如下面的表格所示：

分析：
    從上面可以看出，1.6版本之前，使用attr()能得到正確的結(jié)果，而使用prop()會返回類型錯誤（因為該方法還沒有被定義）；從1.6.0版本起，attr()得到的結(jié)果都不符合預(yù)期，而使用prop()可以得到正確的結(jié)果?？梢院唵蔚乩斫鉃?，從1.6.0版本起，attr()讓出了那些本不屬于自己的權(quán)力，而prop()獲得了它的權(quán)力（這就像古代的攝政王要在皇帝大婚之后將皇權(quán)交回皇帝手中一樣）。因此，我們還是要遵循官方的建議，該用prop()的地方就不要再用attr()了。

總結(jié)：
    應(yīng)該用prop()獲取的屬性如下：async,autofocus,checked,location,multiple,readOnly,selected。

本文中部分觀點為個人理解，不當之處，敬請批評指正
參考文檔：http://api.jquery.com/prop/

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/91284.html

相關(guān)文章

  • React Mixin 的前世今生

    摘要：但非常不幸，并不原生支持。這個單詞相信都很熟悉，高階函數(shù)在函數(shù)式編程是一個基本概念，它描述的是這樣一種函數(shù)，接受函數(shù)作為輸入，或是輸出一個函數(shù)。比如常用的工具方法都是高階函數(shù)。恰與的定義完全一致。這種不同很可能會導致問題的產(chǎn)生。 在 React component 構(gòu)建過程中，常常有這樣的場景，有一類功能要被不同的 Component 公用，然后看得到文檔經(jīng)常提到 Mixin（混入） ...

    姘存按 評論0 收藏0

  • Web技術(shù)的前世今生（二）

    摘要：前言我是，如果你還不認識我，不妨先看看技術(shù)的前世今生一平靜的生活已經(jīng)有一段日子了。傳送門技術(shù)的前世今生一技術(shù)的前世今生三 前言：我是JavaScript，如果你還不認識我，不妨先看看《Web技術(shù)的前世今生（一）》 平靜的生活已經(jīng)有一段日子了。 這一天，HTML大哥面露不悅地走過來問我： Js，你是打算和我們分家嗎？ 大哥，您這說的哪里話，我什么地方做的不對么？我一臉茫然地回答道。 哼，...

    Stardustsky 評論0 收藏0

  • Web技術(shù)的前世今生（二）

    摘要：前言我是，如果你還不認識我，不妨先看看技術(shù)的前世今生一平靜的生活已經(jīng)有一段日子了。傳送門技術(shù)的前世今生一技術(shù)的前世今生三 前言：我是JavaScript，如果你還不認識我，不妨先看看《Web技術(shù)的前世今生（一）》 平靜的生活已經(jīng)有一段日子了。 這一天，HTML大哥面露不悅地走過來問我： Js，你是打算和我們分家嗎？ 大哥，您這說的哪里話，我什么地方做的不對么？我一臉茫然地回答道。 哼，...

    hyuan 評論0 收藏0

  • Web技術(shù)的前世今生（二）

    摘要：前言我是，如果你還不認識我，不妨先看看技術(shù)的前世今生一平靜的生活已經(jīng)有一段日子了。傳送門技術(shù)的前世今生一技術(shù)的前世今生三 前言：我是JavaScript，如果你還不認識我，不妨先看看《Web技術(shù)的前世今生（一）》 平靜的生活已經(jīng)有一段日子了。 這一天，HTML大哥面露不悅地走過來問我： Js，你是打算和我們分家嗎？ 大哥，您這說的哪里話，我什么地方做的不對么？我一臉茫然地回答道。 哼，...

    justjavac 評論0 收藏0

  • Web技術(shù)的前世今生（三）

    摘要：前言我是，如果你還不認識我，不妨先看看技術(shù)的前世今生一，以及技術(shù)的前世今生二前面我提過，我的大哥有一個叫的死黨，這家伙有事沒事經(jīng)常上我們家串門。時間來到了年，在那前后發(fā)生了兩件事讓我印象深刻。傳送門技術(shù)的前世今生一技術(shù)的前世今生二 前言：我是JavaScript，如果你還不認識我，不妨先看看《Web技術(shù)的前世今生（一）》，以及《Web技術(shù)的前世今生（二）》 前面我提過，我的大哥HTML...

    Wuv1Up 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<