Dom编程——增删元素

先介绍几个api
1.document.createElement("标签名")
2.document.getElementById(创建出来的Element) // 默认放在最后
3.父元素.insertBefore(新element, 获取的参照element) // 在某个子元素前面插入
4.父元素.replaceChild(新element,获取的被替换的element) // 注意这是child,children是把所有的清空,留下的全是新的
5.document.getElementById("待删除元素的id").remove() // 我们之前的都是父节点调用添加修改子元素,而remove直接是删除自己的元素本身

// 重复添加没解决id重复的问题。。。
增加元素的js代码如下、替换、删除的js代码就不贴了,可以看js源码
function add() {
  var city = document.createElement("li")
  city.id = "hz"
  city.innerText = "杭州"
  var citys = document.getElementById("citys")
  citys.appendChild(city)
}
function addTJ() {
  var tj = document.createElement("li")
  tj.innerText = "天津"
  tj.id = "tj"
  var citys = document.getElementById("citys")
  citys.insertBefore(tj, document.getElementById("sh"))
}