1.js元素增删改查

2021-07-19 03:36:08

1.增加元素

首先生成元素有三种方式

1. document.write("<a>你好</a>") 元素的父级只能是document

2. 对象.innerHTML= "<a>你好</a>"

3. document.createElement("div") 父级元素只能为document

2.替换元素

替换元素有两种方式

1.父级元素.innerHTML = "<a>你好</a>"

2.父级元素.replaceChild(替换元素,被替换的元素)

第一个参数为要替换的元素

第二个参数为被替换的元素

var father = document.getElementById("father");
    child1 = document.getElementById("child1");
    child2 = document.createElement("a");
    child2.innerHTML = "我不好";
    console.log(child2);
    father.replaceChild(child2,child1);

3.插入元素

参入元素有两种方式

1.从父级尾部插入 father.appendChild(child); 不需要返回任何元素 child为已经定义好的元素

2.从父级底部插入 father.insertBefore(child2,child1) 不需要返回任何元素 child1插入的元素 child2为插入的位置

4.删除元素

删除元素有两种方式

1. 从父级删除元素 father.removeChild(child1) child1 为选择的子级元素

2.自己删除自己 child1.remove()

5.选择元素

1.选择子级 father.children[下标] children 为很多个返回数组需要用下标去取

2.选择父级 child.parentNode.xxx 父级只有一个所以不用下标

PS : 自学记录前端有错欢迎各位大佬指出

QQ:1759435876

微信邮箱同号