2025年3月21日 星期五 甲辰(龙)年 月廿 设为首页 加入收藏
rss
您当前的位置:首页 > 计算机 > 编程开发 > JavaScript

JS创建HTML元素

时间:03-07来源:作者:点击数:99

JavaScript 中,使用 document 对象的 createElement() 方法能够根据参数指定的标签名称创建一个新的元素,并返回新建元素的引用。用法如下:

var element = document.getElement("tagName");

其中,element 表示新建元素的引用,createElement() 是 document 对象的一个方法,该方法只有一个参数,用来指定创建元素的标签名称。

示例1

下面代码在当前文档中创建了一个段落标记 p,存储到变量 p 中。由于该变量表示一个元素节点,所以它的 nodeType 属性值等于 1,而 nodeName 属性值等于 p。

  • var p = document.createElement("p"); //创建段落元素
  • var info = "nodeName:" + p.nodeName; //获取元素名称
  • info += ", nodeType:" + p.nodeType; //获取元素类型,如果为1则表示元素节点
  • console.log(info);

使用 createElement() 方法创建的新元素不会被自动添加到文档里。如果要把这个元素添加到文档里,还需要使用 appendChild()、insertBefore() 或 replaceChild() 方法实现。

示例2

下面代码演示如何把新创建的 p 元素增加到 body 元素下。当元素被添加到文档树中,就会立即显示出来。

  • var p = document.createElement("p"); //创建段落元素
  • document.body.appendChild(p); //增加段落元素到body元素下
方便获取更多学习、工作、生活信息请关注本站微信公众号城东书院 微信服务号城东书院 微信订阅号
推荐内容
相关内容
栏目更新
栏目热门