美文网首页前端面试基础必备JS学习笔记
动态创建HTML元素并添加属性

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

作者: puxiaotaoc | 来源:发表于2018-09-06 14:55 被阅读9次
<!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>

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

相关文章

  • 动态创建HTML元素并添加属性

  • JavaScript Node节点

    通过DOM,JavaScript可以动态移除或添加HTML元素。 添加HTML节点 要创建新的 HTML 元素,需...

  • jQuery 节点操作

    jQuery 节点操作 1、动态创建元素 2、添加元素 3、html创建元素 4、清空元素empty()、html...

  • jQuery节点操作

    添加元素 html创建元素 清空元素 复制元素 属性操作 值和内容 其他样式操作

  • JS:day07

    一、className属性 给元素添加一个新的class属性, 二、HTML5 创建画布

  • HTML 属性

    属性是 HTML 元素提供的附加信息。 HTML 属性 HTML 元素可以设置属性 属性可以在元素中添加附加信息 ...

  • HTML 属性

    属性是 HTML 元素提供的附加信息。 HTML 属性 HTML 元素可以设置属性 属性可以在元素中添加附加信息 ...

  • 利用DocumentFragment 减少页面回流重绘

    一般动态创建html元素都是创建好了直接appendChild()上去,但是如果要添加大量的元素还用这个方法的话就...

  • iOS RunTime 理解

    可以遍历对象的属性 可以动态的添加、修改属性,动态添加、修改、替换方法,动态添加、修改、替换协议 可以动态创建类、...

  • DOM操作

    主要内容: 一些常用的DOM操作:查询元素、创建元素并给元素添加/删除属性、添加/删除元素以及很常用的classL...

网友评论

    本文标题:动态创建HTML元素并添加属性

    本文链接:https://www.haomeiwen.com/subject/iyjxgftx.html