夜光带你走进 前端工程师(三十八 jS )
作者:互联网
夜光序言:
我要做守护骑士,因为我要去守护所有我想要守护的人。
正文:
判断真假
我们用条件语句来判断5大数据类型中的真假; |
|
数据 |
结论 |
数字类型 |
所有数字都是真,0是假 |
字符串 |
所有字符串都是真,’ ’串是假 |
对象 |
所有对象都是真,null是假 |
未定义 |
undefined是假,没有真 |
访问关系
各个节点的相互关系
父节点
父 : parentNode 亲的 一层
<script>
window.onload = function(){
var x = document.getElementById("x");
x.onclick = function(){
this.parentNode.style.display = "none";
// 关掉的是他的 父亲
}
}
</script>
兄弟节点
nextSibling 下一个兄弟 亲的 ie 678 认识
nextElementSibling 其他浏览器认识的
previousSibling 同理 上一个兄弟
previousElementSibling
我们想要兼容 我们可以合写 || 或者
var div = one.nextElementSibling || one.nextSibling;
div.style.backgroundColor = "red";
必须先写 正常浏览器 后写 ie678
子节点
firstChild 第一个孩子 ie678
firstElementChild 第一个孩子 正常浏览器
var one.firstElementChild || one.firstChild;
lastChild
lastElementChild
孩子节点
childNodes 选出全部的孩子
childNodes:它是标准属性,它返回指定元素的子元素集合,包括HTML节点,所有属性,文本节点 (嫡出)
火狐 谷歌等高本版会把换行也看做是子节点
利用 nodeType == 1 时才是元素节点 来获取元素节点
标签 元素
children 重要 选取所有的孩子 (只有元素节点)
这个更好 跟喜欢它 。 (庶出)
ie 678 包含 注释节点 这个要避免开。
dom 的节点操作
新建节点 插入节点 删除节点 克隆节点 等等
创建节点
var div = document.creatElement(“li”);
上面的意思就是 生成一个新的 li 标签
插入节点
1. appendChild(); 添加孩子 append 添加的意思
意思: 添加孩子 放到盒子的 最后面。
2. insertBefore(插入的节点,参照节点) 子节点 添加孩子
写满两个参数
ertBefore(test,childrens[0]);
放到了第一个孩子的前面
如果第二个参数 为 null 则 默认这新生成的盒子放到最后面。
est,null);
移除节点
removeChild() 孩子节点
var da = document.getElementById("xiongda");
demo.removeChild(da);
克隆节点
cloneNode();
复制节点
括号里面可以跟参数 , 如果 里面是 true 深层复制, 除了复制本盒子,还复制子节点
如果为 false 浅层复制 只复制 本节点 不复制 子节点。
标签:三十八,孩子,元素,jS,复制,var,div,节点,夜光 来源: https://blog.csdn.net/weixin_41987706/article/details/90713350