关于元素节点的各种操作（attributes）

简介

在日常使用的过程中，getAttribute、setAttribute、removeAttribute都是会用到的来操作元素的特性的一些方法，例如getAttribute可以用来获取元素的特性，那么这跟直接获取元素特性有什么区别呢？

获取元素特性的方式

这里先有这么一串代码

<div id = "myId" 
class = "myClass" 
title = "myTitle" 
lang = "myLang"></div>

这时候，如果想要获取该div元素上面的各种特性，有两种方法。
第一种：

var myId = document.getElementById("myId");
console.log(myId.getAttribute("id"));
console.log(myId.getAttribute("class"));
console.log(myId.getAttribute("title"));
console.log(myId.getAttribute("lang"));

第二种：

console.log(myId.id);
console.log(myId.className);
console.log(myId.title);
console.log(myId.lang);

这时候打印出来的数值都是一样的
那么这两种方式都一样，官方没理由不删了其中一种的，可是当我们换种方式来测试

<div id = "myId"  οnclick="add"></div>

这时候再来一次

console.log(myId.onclick);
console.log(myId.getAttribute("onclick"))

打印出来的结果会变成这样
出现这种情况的主要元婴是onclick以及其它的一些事件处理程序属性本身就应该是被赋予为一个函数值，也就是一个第一种结果，而通过getAttribute获得的则会变成相对应的字符串。

那么在什么情况下需要使用getAttribute呢？？
这里来看一下这个情况

<div id = "myId"  XueDingE = "TianDog" ></div>

然后我们想要打印这条XueDingE的时候，两种方法出现这样的情况。

console.log(myId.XueDingE);
console.log(myId.getAttribute("XueDingE"))

也就是说，在需要获得元素自定义的特性的时候，就需要使用getAttribute，可是如果是本身固有的，则推荐第一种方式。

attributes属性

这种属性是依托于element类型的一种查询方式

console.log(myId.attributes["id"].nodeValue)

这里同样也可以得出id的值，那么这种方式有什么作用的。
例如：当一个元素里面有很多种特性，我们需要遍历这些特性的时候，也就是当需要将DOM结构序列化为HTML字符串的时候，这种时候就是attributes的使用场景了。
例如：

<div id = "myId"  
    XueDingE = "TianDog" 
    lang="Mylang" 
    class="Myclass"
    οnclick="add"></div>

然后我们需要把里面的特性全部拿出来串联成字符串

var myId = document.getElementById("myId");
        function outAttributes(element){
            var pairs = new Array();
            
            for (let index = 0; index < element.attributes.length; index++) {
                let attrName = element.attributes[index].nodeName;
                let attrValue = element.attributes[index].nodeValue;
                pairs.push(attrName + "=" + attrValue + "=");
            }
            return pairs.join("");
        };
        
        console.log(outAttributes(myId));

得出的结果这样的
大概就是这样的一个情况，如果有说的不对，或者说说的不清楚的地方，欢迎大家指正。

我是一只会切图的老狗，刚刚开始写博客，求点赞！！！