JavaScript 创建元素

■知识点

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

    var element = document.createElement     ("tigName");

其中，参数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 元素下