前面我们说过 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 的标签里面去。