getAttribute和getAttributeNode

QWrap群有個同學問了個問題:為什么IE7中通過getAttribute獲取input的placeholder,結果是null,正常情況下應該是有值的?實
際上這是某些版本IE的bug,在IE10中,F12后把文檔模式調成IE7標準,這個bug能復現。這里剛好有個JK之前寫的placeholder無依賴版,有I
E10的同學可以點開看下bug長什么樣。

使用getAttributeNode得到屬性節點,再通過nodeValue得到該屬性節點的值,就能解決類似的bug。這個方法還可以用來解決我博客之前提到的f
orm表單中有元素在IE低版本中通過getAttribute獲取不到form.name的bug:


<form name="form1">

        <input name="name" />
    </form>
    <script>
    var form = document.getElementsByTagName('form')[0];

    alert(form.getAttribute('name')); /*IE6、7中會得到錯誤的值*/
    alert(form.getAttributeNode('name').nodeValue);
    </script>

getAttributeNode的效率比getAttribute要低一些。如果要獲取元素的id,node.id是最快的方法,node.getAttribut
e('id')其次,getAttributeNode('id').nodeValue最慢。

實際上,瀏覽器中與節點Attribute有關的坑有很多,好在主流JS框架都寫了大量代碼使得各瀏覽器下都能得到合理的結果。隨著低版本IE的逐漸淘汰,這些坑都會
成為歷史的。

最多閱讀

getAttribute和getAttributeNode 10月以前  |  1531次閱讀
一種很帥的JS代碼書寫方式 10月以前  |  1278次閱讀
Web彈出類似Android的Toast的信息提示 10月以前  |  1277次閱讀
Chrome 滾動條凍結現象 10月以前  |  1267次閱讀
通過jQuery發送ajax請求 10月以前  |  1157次閱讀
js為object動態添加屬性 10月以前  |  1040次閱讀
[小Tip]Webkit下設置hash的一個坑 10月以前  |  971次閱讀
AMD 的 CommonJS wrapping 10月以前  |  931次閱讀
用Opera Mobile調試手機版網頁 10月以前  |  762次閱讀
jQuery獲取Select選擇的Text和Value 9月以前  |  679次閱讀
JavaScript跨平臺(兼容各個平臺)事件 9月以前  |  382次閱讀
JavaScript中克隆對象 9月以前  |  348次閱讀
用JavaScript添加style節點 9月以前  |  347次閱讀
JavaScript字符與ASCII碼間的轉換 9月以前  |  343次閱讀
合并兩個Array并去掉重復項 9月以前  |  340次閱讀
判斷一個對象是否為數組 9月以前  |  330次閱讀

25选5玩法中奖