写在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.兄弟关系 - 根据子节点获取父节点
网友评论