JS-设置/获取元素&节点相关

写在2021.这篇文章貌似是18年还是19年写的 无比唏嘘。。

好记性不如烂笔头 还是要把自己还没遗忘的东西那出来拿出来写写

写在开头： 路过的大神看看就好 ~~毕竟我只是一个小菜鸡 。。自娱自乐那种 如果文章内有错误或者您有什么提议的话 肥肠欢迎您的批评指正~

那么就从目前开始吧~~没法从头开始写 想到啥写啥吧 嘻嘻~

———————————————–我是严肃的分割线——————————————-

先提一嘴获取和设置元素属性吧 感觉和动态添加元素关系还挺大的…..

获取和设置元素属性

先了解一下标签内能操作的属性 目前我知道的 a标签的href ，img的title、src ，input的placeholder这种 能通过元素直接调用 元素.属性的 属性 （听起来很拗口。。语死早系列）
然后就是自定义标属性 举个栗子 ： aaa 我直接写进元素里面 aaa=“ ” 这种自己设置（自定义）的属性 不能直接在js里通过 元素.aaa的方式调用
那么问题来了 我都能在标签上设置元素了 那肯定也能用啊 不然岂不是然并卵= =
所以就有下面这东西为我们排忧解难：

获取元素

语法：元素.getAttribute（‘name’）; name就是属性的名字

设置元素

语法 ：元素.setAttribute（ name ， value ）；

移除元素

语法 ：元素.removeAttribute（‘name’）；

举栗：
列如说我在 input标签上来了个aaa属性

<input type="text" aaa="hahaha">

那么我在js里 要这样去操作他：

<script>
 var  input = document.querySelector( input );
 var a =input.getAttribute( aaa )； //获取
 input.setAttribute( aaa , hahah );//设置
 input.removeAttribute( aaa );//移除
</script>

当然 这几个标签还可以操作系统自带标签属性 ：

<script>
var  input = document.querySelector( input );
var b = input.getAttribute( type );
input.setAttribute( type , button );
</script>

注意：上面这几个只能用于元素节点！

既然上面提到了节点 下面就写写节点相关的东西

节点的层级

根据节点的关系来获取元素

• 节点的关系
  1.父子关系
  2.兄弟关系
• 根据子节点获取父节点

语法 ： 子节点.parentNode