前面我們說過 DOM 的節點、DOM 的操作，那麼接下來，我們還要在說一個很重要的東西，DOM 的屬性。
首先什麼是 DOM 的屬性？
你給 div 加個 title，那就叫屬性，你給 div 加個 onclick，那也叫屬性。
那麼我們現在，當然不是簡簡單單給加個屬性就完了，我們希望操作這些屬性。
首先，我們來個最簡單的例子，看下獲取和設置 DOM 屬性的方法。
比如，現在我們有一個 div，我給它加一個 title 屬性。
那麼這時候，我們能不能通過 div.title，給它打印出來呢？
當然，這個毫無難度，你可以看到， aaa 就有了。
那麼接下來，明確的告訴大家，還有另一種方式，叫做 getAttribute。
從它的名字就可以看出來，是專門用來獲取屬性的。
你可以看到，也能出來。
但這時候大家可能會說，我幹嘛寫那麼多啊，直接 div.xxx 不就完了嗎，多方便啊？
注意，實際上來說，getAttribute 這種操作方式，跟我們以前的操作方式 div.xxx，必然是有區別的。
比方說，title，它是一個標準的 HTML 屬性，這個自然是沒問題的。
但現在我換一個，比方說叫做 userid，首先肯定一點，HTML 裏面是絕對沒有這個屬性的。
那麼現在這時候，你可以明確的看到，是個 undefined。
爲什麼呀？
原因很簡單，因爲它是一個不存在的，自定義的屬性，這種屬性，人家是不會幫你解析出來的。
你只能自己通過 getAttribute，從 DOM 節點上，從 HTML 的元素裏面，去找就可以了：
那麼爲什麼會出現這種情況？原因很簡單。
首先，我們承認也好，不承認也罷，瀏覽器也是人寫的，既然是人寫的，那就涉及到各種工作量等等問題，說句不好聽的，人家瀏覽器只考慮一個。
就是說，這些標準的 HTML 屬性，像 title、id、class 等等，這些東西，人家會幫你解析好，放在這個對象上，會作爲它的一個屬性。
而你現在在 js 裏面寫的 div1 這個東西，它並不是真的等於標籤。
所謂的 DOM 對象，它其實是對真正標籤的一個抽象。
所以在這種情況下，div1 它上面沒有 userid 這個屬性也很正常，因爲人家不可能把所有的屬性，全給你列舉出來，人家只找它看得懂的那個東西，看不懂它就放棄了。
而這個 getAttribute，它有點不同，它是真正的去 <div id="div1" userid="123"></div> 這個元素上面去找這個屬性。
所以這時候，就算你是一個以前沒見過，自定義的屬性，它也能給你拉出來。
所以這個 getAttribute，它的特性，就是可以去針對那些，以前沒見過的自定義屬性，這是它的一個特點。
然後當然還有別的，我們除了 getAttribute 以外，還有另外一個。
有 get，是不是就有 set？所以，還有一個 setAttribute。
getAttribute 它就一個參數，就是名字，你要 get 什麼屬性。
getAttribute（'name'）
而 setAttribute，它有兩個參數，一個是名字，一個是值。
setAttribute（'name'，value）
那麼接下來，我們就來看看，我用 setAttribute 和直接寫 div.xxx 又有什麼區別。
比如說，現在我就通過 div1.xxx 的方式來給它加個 title，那麼這個時候能不能加上？
你可以很明確的發現，能加上，是有的。
但是接下來，我現在不加 title，我就加個 user：
那麼這個時候，你可以明確的發現，並沒有。
但是我們先來肯定一點，我們打印下，看看 div1 上有沒有這個 user：
其實還是有的。
但是在 HTML 裏面沒出來。
爲什麼會這樣呢？原因很簡單。
因爲 user 它不是一個標準的 HTML 屬性。
所以，我們的 DOM，會讓 user 這個東西，僅僅停留在我們 js 的對象 div1 的身上，而並不會真的跑到 HTML 身上。
因爲說白了，人家認得的東西，敢往上放，人家都不認識，沒見過就隨便往上放了，萬一出事了呢？
所以，現在這個情況，我這個 user 屬性是沒法真正到 HTML 上的。
大家可能會說，到不了就到不了唄。
那萬一這個東西將來需要被克隆，或者需要被幹啥，你覺得還能出來嗎？
其實是出不來的，不信我們就來試試。
比方說我對 div1 做一個克隆，叫做 div2。
那麼，我們就來看一看，div2 上有沒有 user：
可以明確的看到，undefined。
你可能會說，user 是個自定義屬性，用 div.xxx 拿不到。
沒問題，我們用 getAttribute：
可以看到，一樣沒有。
那麼現在換一個方法，我們用 setAttribute 來添加 user 屬性：
這個時候，你可以看到，就能出來了。
原因很簡單，因爲它真的會成爲 HTML 的一部分，而並不會只停留在我們的 js 對象層面上。
這就是 getAttribute 和 setAttribute 的一個好處。
getAttribute，它是可以去讀取自定義屬性。
setAttribute，它是可以去設置自定義屬性。
而所謂的設置自定義屬性，我們平常也能加，那爲什麼要用它？
因爲它會真的把這個屬性，放到 HTML 的標籤裏面去。