JS DOM创建和添加元素节点

JS DOM创建和添加元素节点

第一种: createElement() + createTextNode() + appdChild()

<body>
  <script>
    let oP = document.createElement("p")
    let oText = document.createTextNode("小情歌")
    oP.appendChild(oText)
    document.body.appendChild(oP)
  </script>
</body>

请添加图片描述

第二种: innerHTML

<body>
  <script>
    let str = "<p>小情歌</p>"
    document.body.innerHTML += str
  </script>
</body>

请添加图片描述

第三种: document.write()

<body>
  <script>
    document.write("<p>小情歌</p>")
  </script>
</body>

请添加图片描述

第四种 : A.insetBefore(B,C)

在A标签中,将B标签添加到C标签之前

<body>
  <div class="wrap">
    <span class="c">王五</span>
  </div>
  <span class="b">张三</span>
  <script>
    let oWrap = document.querySelector(".wrap")
    let oB =   document.querySelector(".b")
    let oC =   document.querySelector(".c")

    oWrap.insertBefore(oB,oC)

  </script>
</body>

请添加图片描述


版权声明:本文为qq_46275230原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。