目录:??

• DOM的对象方法??
  • 其中比较重要的
• 通过案例进行学习??
  • 创建一个新的节点并插入页面
    • 创建一个p节点用于存放文字
    • 创建文本节点并且添加到p标签下
    • 将文本节点成为p标签的子节点
    • 将极品飞车添加到我们的标签中
    • 最终结果??
  • 把新创建的节点添加到某个元素前面
    • 最终结果??
  • 使用新子节点替换旧子节点
    • 最终结果??
  • 删除子节点
    • 最终结果??
  • 获取元素父节点
  • 读取元素内部的HTML代码
    • 最终结果
  • 修改元素内的HTML内容
    • 最终结果
  • 使用innerHTML简化我们添加元素的流程

DOM的对象方法??

其中比较重要的

增:
appendChild();
insertBefore();
createElement();

createTextNode();
删:
removeChild();
改:
replaceChild();

通过案例进行学习??

我们将要通过一个案例来把这几个函数依次掌握一下

这个是我们的项目展示后的样子，此时没有任何css代码

网页端代码如下

    
        
        
        
        
    
    
        
        

            
彩虹六号
            
求生之路
            
GTA5
            
刺客信条
           
        
        

            
创建一个极品飞车节点，添加到#game下
            
将极品飞车节点插入到彩虹六号前面
            
使用极品飞车替换彩虹六号
            
删除#six彩虹六号节点
            
读取#game内的HTML代码
            
设置#six彩虹六号内的HTML代码
        
    

我们之后的代码都不会再全部展示，所有的内容都只是涉及