首页 > 软件开发 > JavaScript >

js创建div;javascript如何创建div

来源:互联网 2023-03-16 23:56:14 302

在制作一些动态页面,常常会使用到JavaScript创建一个新的div>或者是其他标签。JavaScript创建一个标签其实很容。只需使用document.createElement("标签")即可实现(document.createElement("div"))。案例是点击button按钮的时候新建一个div,然后给这个div添加内容。V6L办公区 - 实用经验教程分享!

js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

方法/步骤

  • 1

    新建一个html文件。如图:V6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

  • 2

    在html页面上创建一个点击的button按钮。如图:V6L办公区 - 实用经验教程分享!

    代码:V6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

  • 3

    为button添加点击时创建一个新的div事件。使用document.createElement("div")创建一个新的div,然后使用innerHTML对新建的div设置内容,最后把div放到body>显示。如图:V6L办公区 - 实用经验教程分享!

    代码:V6L办公区 - 实用经验教程分享!

    script type="text/javascript"> function creatDiv(){ var div = document.createElement("div"); div.innerHTML = "你好!";//为div输入内容 document.body.appendChild(div) } /script>V6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

  • 3此文章未经许可获取自百度经验
  • 4

    为button按钮添加点击是创建新div事件。如图:V6L办公区 - 实用经验教程分享!

    代码:V6L办公区 - 实用经验教程分享!

    input type="button" value="点我新建div" onclick="creatDiv()"/>V6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

  • 5

    保存好html文件后使用浏览器打开,点击button按钮会执行已经写好的创建div的事件。如图:V6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

    js创建div;javascript如何创建divV6L办公区 - 实用经验教程分享!

  • 以上方法由办公区教程网编辑摘抄自百度经验可供大家参考!V6L办公区 - 实用经验教程分享!


    标签: JAVASCRIPT

    办公区 Copyright © 2016-2023 www.bgqu.net. Some Rights Reserved. 备案号:湘ICP备2020019561号统计代码