动态创建HTML元素并添加属性（转）

最新推荐文章于 2024-03-29 06:41:31 发布

dragoo1

最新推荐文章于 2024-03-29 06:41:31 发布

阅读量438

点赞数

分类专栏： html5 文章标签： html 动态创建元素属性

原文链接：https://www.jianshu.com/p/bc3f8a61cc9c

版权

html5 专栏收录该内容

17 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>柴婷的测试</title>
    <style>
      .my-class{
        color:red;
      }
      .p-class{
        color:green;
        font-size: 34px;
      }
    </style>
  </head>
  <body>

    <script type="text/javascript">
      var d = document.createElement('div');
      d.setAttribute('class','my-class');
      var p = document.createElement('p');
      p.setAttribute('class','p-class');
      var text = document.createTextNode('我是p标签')
      p.appendChild(text);
      d.appendChild(p);
      document.body.appendChild(d);
    </script>
  </body>
</html>